[{"data":1,"prerenderedAt":705},["ShallowReactive",2],{"navigation":3,"blogNavigation":232,"page-\u002Fdocs\u002F%E7%AE%80%E5%8D%95%E6%96%87%E6%A1%A3\u002Fcomponents\u002Fmdc-showcase":418,"\u002Fdocs\u002F%E7%AE%80%E5%8D%95%E6%96%87%E6%A1%A3\u002Fcomponents\u002Fmdc-showcase-surround":700},[4],{"title":5,"path":6,"stem":7,"children":8,"page":57},"Docs","\u002Fdocs","docs",[9,176,184],{"title":10,"path":11,"stem":12,"children":13,"icon":16},"简单文档","\u002Fdocs\u002F简单文档","docs\u002F1.简单文档\u002F1.index",[14,17,22,58,63,166,171],{"title":15,"path":11,"stem":12,"icon":16},"入门简介","lucide-house",{"title":18,"path":19,"stem":20,"icon":21},"安装与开发","\u002Fdocs\u002F简单文档\u002Finstallation","docs\u002F1.简单文档\u002F2.installation","lucide-play",{"title":23,"path":24,"stem":25,"children":26,"page":57},"开始写作","\u002Fdocs\u002F简单文档\u002Fwriting","docs\u002F1.简单文档\u002F3.writing",[27,32,37,42,47,52],{"title":28,"path":29,"stem":30,"icon":31},"Markdown","\u002Fdocs\u002F简单文档\u002Fwriting\u002Fmarkdown","docs\u002F1.简单文档\u002F3.writing\u002F1.markdown","simple-icons:markdown",{"title":33,"path":34,"stem":35,"icon":36},"页面 frontmatter","\u002Fdocs\u002F简单文档\u002Fwriting\u002Fpages","docs\u002F1.简单文档\u002F3.writing\u002F2.pages","lucide:file-text",{"title":38,"path":39,"stem":40,"icon":41},"目录与文件命名","\u002Fdocs\u002F简单文档\u002Fwriting\u002Ffolders","docs\u002F1.简单文档\u002F3.writing\u002F3.folders","lucide:folder",{"title":43,"path":44,"stem":45,"icon":46},"单页面示例","\u002Fdocs\u002F简单文档\u002Fwriting\u002Ffull-page-example","docs\u002F1.简单文档\u002F3.writing\u002F4.full-page-example","lucide:layout-template",{"title":48,"path":49,"stem":50,"icon":51},"内容检查与测试","\u002Fdocs\u002F简单文档\u002Fwriting\u002Ftest","docs\u002F1.简单文档\u002F3.writing\u002F5.test","lucide:shield-check",{"title":53,"path":54,"stem":55,"icon":56},"在文章中使用组件","\u002Fdocs\u002F简单文档\u002Fwriting\u002Fmdc-content","docs\u002F1.简单文档\u002F3.writing\u002F6.mdc-content","lucide-blocks",false,{"title":59,"path":60,"stem":61,"icon":62},"部署服务","\u002Fdocs\u002F简单文档\u002Fdeployment","docs\u002F1.简单文档\u002F4.deployment","lucide:cloud",{"title":64,"path":65,"stem":66,"children":67,"page":57},"组件特性","\u002Fdocs\u002F简单文档\u002Fcomponents","docs\u002F1.简单文档\u002F5.components",[68,73,77,81,85,89,93,97,101,105,110,114,118,122,126,131,136,141,146,150,154,158,162],{"title":69,"path":70,"stem":71,"icon":72},"常用组件","\u002Fdocs\u002F简单文档\u002Fcomponents\u002Fapi","docs\u002F1.简单文档\u002F5.components\u002F1.API","lucide-component",{"title":74,"path":75,"stem":76},"Alert","\u002Fdocs\u002F简单文档\u002Fcomponents\u002Falert","docs\u002F1.简单文档\u002F5.components\u002Falert",{"title":78,"path":79,"stem":80},"Badge","\u002Fdocs\u002F简单文档\u002Fcomponents\u002Fbadge","docs\u002F1.简单文档\u002F5.components\u002Fbadge",{"title":82,"path":83,"stem":84},"Button Link","\u002Fdocs\u002F简单文档\u002Fcomponents\u002Fbutton-link","docs\u002F1.简单文档\u002F5.components\u002Fbutton-link",{"title":86,"path":87,"stem":88},"Callout","\u002Fdocs\u002F简单文档\u002Fcomponents\u002Fcallout","docs\u002F1.简单文档\u002F5.components\u002Fcallout",{"title":90,"path":91,"stem":92},"Card","\u002Fdocs\u002F简单文档\u002Fcomponents\u002Fcard","docs\u002F1.简单文档\u002F5.components\u002Fcard",{"title":94,"path":95,"stem":96},"Card Group","\u002Fdocs\u002F简单文档\u002Fcomponents\u002Fcard-group","docs\u002F1.简单文档\u002F5.components\u002Fcard-group",{"title":98,"path":99,"stem":100},"Code Group","\u002Fdocs\u002F简单文档\u002Fcomponents\u002Fcode-group","docs\u002F1.简单文档\u002F5.components\u002Fcode-group",{"title":102,"path":103,"stem":104},"Code Tree","\u002Fdocs\u002F简单文档\u002Fcomponents\u002Fcode-tree","docs\u002F1.简单文档\u002F5.components\u002Fcode-tree",{"title":106,"path":107,"stem":108,"icon":109},"博客与文档内容块","\u002Fdocs\u002F简单文档\u002Fcomponents\u002Fcontent-blocks","docs\u002F1.简单文档\u002F5.components\u002Fcontent-blocks","lucide-panels-top-left",{"title":111,"path":112,"stem":113},"Field","\u002Fdocs\u002F简单文档\u002Fcomponents\u002Ffield","docs\u002F1.简单文档\u002F5.components\u002Ffield",{"title":115,"path":116,"stem":117},"Field Group","\u002Fdocs\u002F简单文档\u002Fcomponents\u002Ffield-group","docs\u002F1.简单文档\u002F5.components\u002Ffield-group",{"title":119,"path":120,"stem":121},"File Tree","\u002Fdocs\u002F简单文档\u002Fcomponents\u002Ffile-tree","docs\u002F1.简单文档\u002F5.components\u002Ffile-tree",{"title":123,"path":124,"stem":125},"Icon","\u002Fdocs\u002F简单文档\u002Fcomponents\u002Ficon","docs\u002F1.简单文档\u002F5.components\u002Ficon",{"title":127,"path":128,"stem":129,"icon":130},"数据、API 与阅读交互组件","\u002Fdocs\u002F简单文档\u002Fcomponents\u002Finteractive-blocks","docs\u002F1.简单文档\u002F5.components\u002Finteractive-blocks","lucide-table-properties",{"title":132,"path":133,"stem":134,"icon":135},"进阶组件交互演示","\u002Fdocs\u002F简单文档\u002Fcomponents\u002Finteractive-showcase","docs\u002F1.简单文档\u002F5.components\u002Finteractive-showcase","lucide-sliders-horizontal",{"title":137,"path":138,"stem":139,"icon":140},"MDC 语法与组件注册","\u002Fdocs\u002F简单文档\u002Fcomponents\u002Fmdc-guide","docs\u002F1.简单文档\u002F5.components\u002Fmdc-guide","lucide-file-code",{"title":142,"path":143,"stem":144,"icon":145},"MDC 组件交互演示","\u002Fdocs\u002F简单文档\u002Fcomponents\u002Fmdc-showcase","docs\u002F1.简单文档\u002F5.components\u002Fmdc-showcase","lucide-mouse-pointer-click",{"title":147,"path":148,"stem":149},"Playground","\u002Fdocs\u002F简单文档\u002Fcomponents\u002Fplayground","docs\u002F1.简单文档\u002F5.components\u002Fplayground",{"title":151,"path":152,"stem":153},"Read More","\u002Fdocs\u002F简单文档\u002Fcomponents\u002Fread-more","docs\u002F1.简单文档\u002F5.components\u002Fread-more",{"title":155,"path":156,"stem":157},"Stack","\u002Fdocs\u002F简单文档\u002Fcomponents\u002Fstack","docs\u002F1.简单文档\u002F5.components\u002Fstack",{"title":159,"path":160,"stem":161},"Steps","\u002Fdocs\u002F简单文档\u002Fcomponents\u002Fsteps","docs\u002F1.简单文档\u002F5.components\u002Fsteps",{"title":163,"path":164,"stem":165},"Tabs","\u002Fdocs\u002F简单文档\u002Fcomponents\u002Ftabs","docs\u002F1.简单文档\u002F5.components\u002Ftabs",{"title":167,"path":168,"stem":169,"icon":170},"功能与路线图","\u002Fdocs\u002F简单文档\u002F功能与路线图","docs\u002F1.简单文档\u002F6.功能与路线图","lucide:map",{"title":172,"path":173,"stem":174,"icon":175},"Nuxt Studio 现状与运维说明","\u002Fdocs\u002F简单文档\u002Fnuxt-studio-upgrade-plan","docs\u002F1.简单文档\u002F7.nuxt-studio-upgrade-plan","simple-icons:nuxtdotjs",{"title":177,"path":178,"stem":179,"children":180,"icon":183},"无人自助系统","\u002Fdocs\u002F无人自助系统","docs\u002F2.无人自助系统\u002F1.index",[181],{"title":182,"path":178,"stem":179,"icon":183},"介绍","simple-icons:opencollective",{"title":185,"path":186,"stem":187,"children":188,"icon":191},"SwitchOps 交换机巡检","\u002Fdocs\u002Fswitchops交换机巡检","docs\u002F3.SwitchOps交换机巡检\u002F1.index",[189,192,197,202,207,212,217,222,227],{"title":190,"path":186,"stem":187,"icon":191},"产品简介","lucide:house",{"title":193,"path":194,"stem":195,"icon":196},"快速开始","\u002Fdocs\u002Fswitchops交换机巡检\u002Fquick-start","docs\u002F3.SwitchOps交换机巡检\u002F2.quick-start","lucide:rocket",{"title":198,"path":199,"stem":200,"icon":201},"设备清单配置","\u002Fdocs\u002Fswitchops交换机巡检\u002Fdevice-config","docs\u002F3.SwitchOps交换机巡检\u002F3.device-config","lucide:list-tree",{"title":203,"path":204,"stem":205,"icon":206},"图形界面使用","\u002Fdocs\u002Fswitchops交换机巡检\u002Fgui-guide","docs\u002F3.SwitchOps交换机巡检\u002F4.gui-guide","lucide:monitor",{"title":208,"path":209,"stem":210,"icon":211},"命令行使用","\u002Fdocs\u002Fswitchops交换机巡检\u002Fcli-guide","docs\u002F3.SwitchOps交换机巡检\u002F5.cli-guide","lucide:square-terminal",{"title":213,"path":214,"stem":215,"icon":216},"报告与历史数据","\u002Fdocs\u002Fswitchops交换机巡检\u002Freports-history","docs\u002F3.SwitchOps交换机巡检\u002F6.reports-history","lucide:file-chart-column",{"title":218,"path":219,"stem":220,"icon":221},"高级配置","\u002Fdocs\u002Fswitchops交换机巡检\u002Fadvanced-config","docs\u002F3.SwitchOps交换机巡检\u002F7.advanced-config","lucide:settings",{"title":223,"path":224,"stem":225,"icon":226},"Windows 打包部署","\u002Fdocs\u002Fswitchops交换机巡检\u002Fwindows-deployment","docs\u002F3.SwitchOps交换机巡检\u002F8.windows-deployment","lucide:package",{"title":228,"path":229,"stem":230,"icon":231},"故障排查与安全","\u002Fdocs\u002Fswitchops交换机巡检\u002Ftroubleshooting-security","docs\u002F3.SwitchOps交换机巡检\u002F9.troubleshooting-security","lucide:shield-alert",[233],{"title":234,"path":235,"stem":236,"children":237,"page":57},"Blog","\u002Fblog","blog",[238,401,410],{"title":239,"path":240,"stem":241,"children":242,"page":57},"技术栈","\u002Fblog\u002F技术栈","blog\u002F1.技术栈",[243,248,253,258,262,267,271,276,280,284,289,294,299,303,307,311,315,319,324,328,333,338,343,347,352,357,362,367,372,376,381,386,391,396],{"title":244,"path":245,"stem":246,"icon":247},"最近给文档站补了些什么","\u002Fblog\u002F技术栈\u002Festel-docs-recent-updates","blog\u002F1.技术栈\u002F968.estel-docs-recent-updates","lucide:blocks",{"title":249,"path":250,"stem":251,"icon":252},"国产化终端能上办公网，却登录不了 OA：一次网络准入故障排查","\u002Fblog\u002F技术栈\u002F国产化终端办公oa网络准入故障排查","blog\u002F1.技术栈\u002F969.国产化终端办公OA网络准入故障排查","lucide:network",{"title":254,"path":255,"stem":256,"icon":257},"准备新的插件","\u002Fblog\u002F技术栈\u002F新的插件","blog\u002F1.技术栈\u002F970.新的插件","simple-icons:debian",{"title":259,"path":260,"stem":261,"icon":257},"防于未然，先固不破 — Debian 12 快速加固实战","\u002Fblog\u002F技术栈\u002F服务器加固实战","blog\u002F1.技术栈\u002F971.服务器加固实战",{"title":263,"path":264,"stem":265,"icon":266},"nmap高级应用技巧-实战","\u002Fblog\u002F技术栈\u002Fnmap高级应用技巧-实战","blog\u002F1.技术栈\u002F972.nmap高级应用技巧-实战","simple-icons:openstreetmap",{"title":268,"path":269,"stem":270,"icon":266},"nmap高级应用技巧-NSE","\u002Fblog\u002F技术栈\u002Fnmap高级应用技巧-nse","blog\u002F1.技术栈\u002F973.nmap高级应用技巧-NSE",{"title":272,"path":273,"stem":274,"icon":275},"部分vue组件语法预览","\u002Fblog\u002F技术栈\u002F部分组件语法展示","blog\u002F1.技术栈\u002F974.部分组件语法展示","simple-icons:vuedotjs",{"title":277,"path":278,"stem":279,"icon":175},"新的文档渲染样式","\u002Fblog\u002F技术栈\u002F新的文档渲染样式","blog\u002F1.技术栈\u002F975.新的文档渲染样式",{"title":281,"path":282,"stem":283,"icon":175},"Nuxt 微信分享接口","\u002Fblog\u002F技术栈\u002Fnuxt-微信分享接口","blog\u002F1.技术栈\u002F976.Nuxt 微信分享接口",{"title":285,"path":286,"stem":287,"icon":288},"AI复合应用 合同审查","\u002Fblog\u002F技术栈\u002Fai复合应用-合同审查","blog\u002F1.技术栈\u002F978.AI复合应用 合同审查","simple-icons:openai",{"title":290,"path":291,"stem":292,"icon":293},"Kali 安装 GVM","\u002Fblog\u002F技术栈\u002Fkali-安装-gvm","blog\u002F1.技术栈\u002F979.Kali 安装 GVM","simple-icons:kalilinux",{"title":295,"path":296,"stem":297,"icon":298},"GPT-5","\u002Fblog\u002F技术栈\u002Fgpt5","blog\u002F1.技术栈\u002F980.GPT5","simple-icons:powershell",{"title":300,"path":301,"stem":302,"icon":288},"使用 AI 守护内网安全","\u002Fblog\u002F技术栈\u002F使用-ai-守护内网安全","blog\u002F1.技术栈\u002F981.使用 AI 守护内网安全",{"title":304,"path":305,"stem":306,"icon":266},"系统安全扫描工具命令集合","\u002Fblog\u002F技术栈\u002F系统安全扫描工具命令集合","blog\u002F1.技术栈\u002F982.系统安全扫描工具命令集合",{"title":308,"path":309,"stem":310},"用 MDC 组织技术文章","\u002Fblog\u002F技术栈\u002Fmdc-article-example","blog\u002F1.技术栈\u002F983.mdc-article-example",{"title":312,"path":313,"stem":314,"icon":293},"系统安全综合评估报告","\u002Fblog\u002F技术栈\u002F系统安全综合评估报告","blog\u002F1.技术栈\u002F983.系统安全综合评估报告",{"title":316,"path":317,"stem":318},"用交互组件写一份技术说明","\u002Fblog\u002F技术栈\u002Fmdc-interactive-example","blog\u002F1.技术栈\u002F984.mdc-interactive-example",{"title":320,"path":321,"stem":322,"icon":323},"树莓派安装 Kali Linux","\u002Fblog\u002F技术栈\u002F树莓派安装-kali-linux","blog\u002F1.技术栈\u002F984.树莓派安装 Kali Linux","simple-icons:raspberrypi",{"title":325,"path":326,"stem":327,"icon":175},"Nuxt UI Pro","\u002Fblog\u002F技术栈\u002Fnuxt-ui-pro","blog\u002F1.技术栈\u002F985.Nuxt UI Pro",{"title":329,"path":330,"stem":331,"icon":332},"Supabase 阿里云短信","\u002Fblog\u002F技术栈\u002Fsupabase-阿里云短信","blog\u002F1.技术栈\u002F986.Supabase 阿里云短信","simple-icons:alibabacloud",{"title":334,"path":335,"stem":336,"icon":337},"Coolify","\u002Fblog\u002F技术栈\u002Fcoolify","blog\u002F1.技术栈\u002F987.Coolify","simple-icons:chai",{"title":339,"path":340,"stem":341,"icon":342},"Python 代码规范","\u002Fblog\u002F技术栈\u002Fpython-代码规范","blog\u002F1.技术栈\u002F988.Python 代码规范","simple-icons:python",{"title":344,"path":345,"stem":346,"icon":175},"Nuxt3 代码规范","\u002Fblog\u002F技术栈\u002Fnuxt3-代码规范","blog\u002F1.技术栈\u002F989.Nuxt3 代码规范",{"title":348,"path":349,"stem":350,"icon":351},"Linux 系统 Swap 分区配置指南","\u002Fblog\u002F技术栈\u002Flinux-系统-swap-分区配置指南","blog\u002F1.技术栈\u002F990.Linux 系统 Swap 分区配置指南","simple-icons:linux",{"title":353,"path":354,"stem":355,"icon":356},"从Supabase迁移到Appwrite","\u002Fblog\u002F技术栈\u002F从supabase迁移到appwrite","blog\u002F1.技术栈\u002F991.从Supabase迁移到Appwrite","simple-icons:supabase",{"title":358,"path":359,"stem":360,"icon":361},"AppWrite 项目资源占用情况","\u002Fblog\u002F技术栈\u002Fappwrite-项目资源占用情况","blog\u002F1.技术栈\u002F992.AppWrite 项目资源占用情况","simple-icons:appwrite",{"title":363,"path":364,"stem":365,"icon":366},"Docker 里配置hosts","\u002Fblog\u002F技术栈\u002Fdocker-里配置hosts","blog\u002F1.技术栈\u002F993.Docker 里配置hosts","simple-icons:docker",{"title":368,"path":369,"stem":370,"icon":371},"MySQL 中如何忽略表名的大小写","\u002Fblog\u002F技术栈\u002Fmysql-中如何忽略表名的大小写","blog\u002F1.技术栈\u002F994.MySQL 中如何忽略表名的大小写","simple-icons:mysql",{"title":373,"path":374,"stem":375,"icon":257},"Debian 12 安装nodejs","\u002Fblog\u002F技术栈\u002Fdebian-12-安装nodejs","blog\u002F1.技术栈\u002F995.Debian 12 安装nodejs",{"title":377,"path":378,"stem":379,"icon":380},"Dify + Supabase：打造带数据库的AI问答机器人","\u002Fblog\u002F技术栈\u002Fdify-supabase：打造带数据库的ai问答机器人","blog\u002F1.技术栈\u002F996.Dify + Supabase：打造带数据库的AI问答机器人","simple-icons:reactbootstrap",{"title":382,"path":383,"stem":384,"icon":385},"安装 VS Code到浏览器 -- Code Server","\u002Fblog\u002F技术栈\u002F安装-vs-code到浏览器-code-server-copy","blog\u002F1.技术栈\u002F996.安装 VS Code到浏览器 -- Code Server copy","simple-icons:visualstudiocode",{"title":387,"path":388,"stem":389,"icon":390},"Debian 12 云服务器初始安全设置与优化指南","\u002Fblog\u002F技术栈\u002Fdebian-12-云服务器初始安全设置与优化指南","blog\u002F1.技术栈\u002F997.Debian 12 云服务器初始安全设置与优化指南","lucide-server",{"title":392,"path":393,"stem":394,"icon":395},"Iperf3 万兆网络打流测试指南","\u002Fblog\u002F技术栈\u002Fiperf3-万兆网络打流测试指南","blog\u002F1.技术栈\u002F998.Iperf3 万兆网络打流测试指南","lucide-network",{"title":397,"path":398,"stem":399,"icon":400},"GROK3 and Deepseek","\u002Fblog\u002F技术栈\u002Fgrok3-and-deepseek","blog\u002F1.技术栈\u002F999.GROK3-and-Deepseek","lucide-brain",{"title":402,"path":403,"stem":404,"children":405,"page":57},"AI","\u002Fblog\u002Fai","blog\u002F2.AI",[406],{"title":407,"path":408,"stem":409,"icon":337},"AI最佳实践","\u002Fblog\u002Fai\u002Fai","blog\u002F2.AI\u002F01.AI",{"title":411,"path":412,"stem":413,"children":414,"page":57},"生活","\u002Fblog\u002F生活","blog\u002F3.生活",[415],{"title":411,"path":416,"stem":417,"icon":337},"\u002Fblog\u002F生活\u002F生活","blog\u002F3.生活\u002F01.生活",{"id":419,"title":142,"badges":420,"body":421,"date":420,"description":693,"draft":57,"extension":694,"fullpage":57,"icon":420,"links":420,"meta":695,"navBadges":420,"navigation":696,"path":143,"rawbody":697,"seo":698,"stem":144,"updated":420,"__hash__":699},"docs\u002Fdocs\u002F1.简单文档\u002F5.components\u002Fmdc-showcase.md",null,{"type":422,"value":423,"toc":682},"minimark",[424,439,443,469,472,515,529,532,544,553,556,564,567,572,575,600,603,608,612,615,621,624,640,652,659,678],[425,426,427,428,433,434,438],"p",{},"这是实际渲染的演示页，所有块均写在这个 Markdown 文件中。属性与复制代码见 ",[429,430,432],"a",{"href":431},"\u002Fdocs\u002F%E7%AE%80%E5%8D%95%E6%96%87%E6%A1%A3\u002Fcomponents\u002Fcontent-blocks","内容块说明","，写法见 ",[429,435,437],{"href":436},"\u002Fdocs\u002F%E7%AE%80%E5%8D%95%E6%96%87%E6%A1%A3\u002Fcomponents\u002Fmdc-guide","MDC 语法","。下列进度和数值是演示数据。",[440,441,442],"h2",{"id":442},"文章摘要",[444,445,447,462],"article-summary",{"title":446},"示例文章摘要",[448,449,450,459],"ul",{},[451,452,453,454,458],"li",{},"同一套组件可以用于 ",[455,456,457],"strong",{},"博客和文档","。",[451,460,461],{},"文章正文保持 Markdown 的可读性与可复制性。",[463,464,466],"template",{"v-slot:takeaway":465},"",[425,467,468],{},"下一步：试着展开说明、勾选清单并查看大图。",[440,470,471],{"id":471},"折叠说明",[473,474,476,479,509],"expand-box",{"title":475},"查看验证命令",[425,477,478],{},"下面的命令是可复制的文本，展开后无需加载外部服务。",[480,481,485],"pre",{"className":482,"code":483,"language":484,"meta":465,"style":465},"language-bash shiki shiki-themes github-light github-light github-dark vitesse-light vitesse-dark catppuccin-latte catppuccin-mocha one-light one-dark-pro material-theme-lighter material-theme-palenight min-light min-dark","pnpm content:check\npnpm test:unit\n","bash",[486,487,488,501],"code",{"__ignoreMap":465},[489,490,493,497],"span",{"class":491,"line":492},"line",1,[489,494,496],{"class":495},"sCf0g","pnpm",[489,498,500],{"class":499},"s254i"," content:check\n",[489,502,504,506],{"class":491,"line":503},2,[489,505,496],{"class":495},[489,507,508],{"class":499}," test:unit\n",[425,510,511],{},[429,512,514],{"href":513},"\u002Fdocs\u002F%E7%AE%80%E5%8D%95%E6%96%87%E6%A1%A3\u002Fcomponents\u002Fapi","返回组件索引",[473,516,519],{"title":517,":open":518},"默认展开的说明","true",[425,520,521,524,525,528],{},[486,522,523],{},"open"," 是布尔属性，可以用 YAML 或 ",[486,526,527],{},":open=\"true\""," 设置。",[440,530,531],{"id":531},"参考资料",[533,534,537],"link-card",{"title":535,"to":138,"description":536},"进入 MDC 写法说明","适合第一次在 Markdown 中使用 Vue 组件的作者。",[425,538,539,540,543],{},"正文中还可以放 ",[429,541,542],{"href":513},"组件 API","，它是独立链接。",[533,545,550],{"title":546,"to":547,"icon":548,"target":549},"Nuxt Content 官方文档","https:\u002F\u002Fcontent.nuxt.com","lucide-external-link","_blank",[425,551,552],{},"打开新窗口查看上游文档。",[440,554,555],{"id":555},"署名引用",[557,558,561],"quote-block",{"author":559,"source":560,"to":138},"示例作者","MDC 写作笔记",[425,562,563],{},"让文章解释一个问题，让组件帮助读者完成一步操作。",[440,565,566],{"id":566},"指标展示",[568,569],"stat-grid",{":columns":570,":items":571},"3","[{\"label\":\"示例节点\",\"value\":12},{\"label\":\"检查项\",\"value\":8},{\"label\":\"结果\",\"value\":\"通过\",\"description\":\"仅用于布局展示\"}]",[440,573,574],{"id":574},"过程时间线",[576,577,579,588],"doc-timeline",{"label":578},"示例排查时间线",[580,581,585],"timeline-item",{"date":582,"dateTime":583,"title":584},"09:00","2026-10-04T09:00:00+08:00","记录现象",[425,586,587],{},"描述触发条件与影响范围。",[580,589,593],{"date":590,"dateTime":591,"title":592},"09:30","2026-10-04T09:30:00+08:00","验证修复",[425,594,595,596,599],{},"运行",[455,597,598],{},"回归检查","，确认问题不会再次出现。",[440,601,602],{"id":602},"可操作清单",[604,605],"task-checklist",{":items":606,"title":607},"[{\"label\":\"了解 MDC 的块语法\",\"checked\":true},{\"label\":\"尝试勾选这一项\",\"description\":\"完成数会同步更新\"},{\"label\":\"打开下面的图片预览\"}]","阅读练习",[604,609],{":items":610,"title":611,":readonly":518},"[{\"label\":\"已完成的示例检查\",\"checked\":true},{\"label\":\"待完成的示例检查\"}]","只读演示",[440,613,614],{"id":614},"图库与预览",[616,617],"image-gallery",{":columns":618,":images":619,"title":620},"2","[{\"src\":\"\u002Fimages\u002Fmdc\u002Frender-flow.svg\",\"alt\":\"MDC 渲染流程图\",\"caption\":\"Markdown → Content AST → Vue 组件\"},{\"src\":\"\u002Fimages\u002Fmdc\u002Fpublish-flow.svg\",\"alt\":\"文档发布流程图\",\"caption\":\"编写 → 验证 → 发布\"}]","MDC 工作流",[440,622,623],{"id":623},"原有组件兼容",[625,626,629],"alert",{"title":627,"type":628},"旧文章提醒","warning",[425,630,631,632,635,636,639],{},"原有 ",[486,633,634],{},"::alert"," 语法现在有明确的 Vue 实现，",[455,637,638],{},"Markdown 正文","和类型颜色均可显示。",[641,642,645],"e-card",{"description":643,"icon":72,"title":644},"已有组件继续可用。","原有卡片",[425,646,647,648,651],{},"这是 ",[486,649,650],{},"ECard"," 的默认插槽。",[653,654,656],"button-link",{"right-icon":655,"to":70},"lucide-arrow-right",[425,657,658],{},"查看全部组件",[660,661,662,672],"tabs",{},[663,664,665],"tabs-item",{"label":28},[425,666,667,668,671],{},"使用 ",[486,669,670],{},"::组件名"," 写内容。",[663,673,675],{"label":674},"Vue",[425,676,677],{},"通过 props 与 slot 接收内容。",[679,680,681],"style",{},"html pre.shiki code .sCf0g, html code.shiki .sCf0g{--shiki-light:#6F42C1;--shiki-light-font-style:inherit;--shiki-default:#6F42C1;--shiki-default-font-style:inherit;--shiki-dark:#B392F0;--shiki-dark-font-style:inherit;--shiki-code-theme-vitesse-light:#59873A;--shiki-code-theme-vitesse-light-font-style:inherit;--shiki-code-theme-vitesse-dark:#80A665;--shiki-code-theme-vitesse-dark-font-style:inherit;--shiki-code-theme-catppuccin-light:#1E66F5;--shiki-code-theme-catppuccin-light-font-style:italic;--shiki-code-theme-catppuccin-dark:#89B4FA;--shiki-code-theme-catppuccin-dark-font-style:italic;--shiki-code-theme-one-light:#4078F2;--shiki-code-theme-one-light-font-style:inherit;--shiki-code-theme-one-dark:#61AFEF;--shiki-code-theme-one-dark-font-style:inherit;--shiki-code-theme-material-light:#E2931D;--shiki-code-theme-material-light-font-style:inherit;--shiki-code-theme-material-dark:#FFCB6B;--shiki-code-theme-material-dark-font-style:inherit;--shiki-code-theme-min-light:#6F42C1;--shiki-code-theme-min-light-font-style:inherit;--shiki-code-theme-min-dark:#B392F0;--shiki-code-theme-min-dark-font-style:inherit}html pre.shiki code .s254i, html code.shiki .s254i{--shiki-light:#032F62;--shiki-default:#032F62;--shiki-dark:#9ECBFF;--shiki-code-theme-vitesse-light:#B56959;--shiki-code-theme-vitesse-dark:#C98A7D;--shiki-code-theme-catppuccin-light:#40A02B;--shiki-code-theme-catppuccin-dark:#A6E3A1;--shiki-code-theme-one-light:#50A14F;--shiki-code-theme-one-dark:#98C379;--shiki-code-theme-material-light:#91B859;--shiki-code-theme-material-dark:#C3E88D;--shiki-code-theme-min-light:#2B5581;--shiki-code-theme-min-dark:#9DB1C5}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html .code-theme-vitesse-light .shiki span {color: var(--shiki-code-theme-vitesse-light);background: var(--shiki-code-theme-vitesse-light-bg);font-style: var(--shiki-code-theme-vitesse-light-font-style);font-weight: var(--shiki-code-theme-vitesse-light-font-weight);text-decoration: var(--shiki-code-theme-vitesse-light-text-decoration);}html.code-theme-vitesse-light .shiki span {color: var(--shiki-code-theme-vitesse-light);background: var(--shiki-code-theme-vitesse-light-bg);font-style: var(--shiki-code-theme-vitesse-light-font-style);font-weight: var(--shiki-code-theme-vitesse-light-font-weight);text-decoration: var(--shiki-code-theme-vitesse-light-text-decoration);}html .code-theme-vitesse-dark .shiki span {color: var(--shiki-code-theme-vitesse-dark);background: var(--shiki-code-theme-vitesse-dark-bg);font-style: var(--shiki-code-theme-vitesse-dark-font-style);font-weight: var(--shiki-code-theme-vitesse-dark-font-weight);text-decoration: var(--shiki-code-theme-vitesse-dark-text-decoration);}html.code-theme-vitesse-dark .shiki span {color: var(--shiki-code-theme-vitesse-dark);background: var(--shiki-code-theme-vitesse-dark-bg);font-style: var(--shiki-code-theme-vitesse-dark-font-style);font-weight: var(--shiki-code-theme-vitesse-dark-font-weight);text-decoration: var(--shiki-code-theme-vitesse-dark-text-decoration);}html .code-theme-catppuccin-light .shiki span {color: var(--shiki-code-theme-catppuccin-light);background: var(--shiki-code-theme-catppuccin-light-bg);font-style: var(--shiki-code-theme-catppuccin-light-font-style);font-weight: var(--shiki-code-theme-catppuccin-light-font-weight);text-decoration: var(--shiki-code-theme-catppuccin-light-text-decoration);}html.code-theme-catppuccin-light .shiki span {color: var(--shiki-code-theme-catppuccin-light);background: var(--shiki-code-theme-catppuccin-light-bg);font-style: var(--shiki-code-theme-catppuccin-light-font-style);font-weight: var(--shiki-code-theme-catppuccin-light-font-weight);text-decoration: var(--shiki-code-theme-catppuccin-light-text-decoration);}html .code-theme-catppuccin-dark .shiki span {color: var(--shiki-code-theme-catppuccin-dark);background: var(--shiki-code-theme-catppuccin-dark-bg);font-style: var(--shiki-code-theme-catppuccin-dark-font-style);font-weight: var(--shiki-code-theme-catppuccin-dark-font-weight);text-decoration: var(--shiki-code-theme-catppuccin-dark-text-decoration);}html.code-theme-catppuccin-dark .shiki span {color: var(--shiki-code-theme-catppuccin-dark);background: var(--shiki-code-theme-catppuccin-dark-bg);font-style: var(--shiki-code-theme-catppuccin-dark-font-style);font-weight: var(--shiki-code-theme-catppuccin-dark-font-weight);text-decoration: var(--shiki-code-theme-catppuccin-dark-text-decoration);}html .code-theme-one-light .shiki span {color: var(--shiki-code-theme-one-light);background: var(--shiki-code-theme-one-light-bg);font-style: var(--shiki-code-theme-one-light-font-style);font-weight: var(--shiki-code-theme-one-light-font-weight);text-decoration: var(--shiki-code-theme-one-light-text-decoration);}html.code-theme-one-light .shiki span {color: var(--shiki-code-theme-one-light);background: var(--shiki-code-theme-one-light-bg);font-style: var(--shiki-code-theme-one-light-font-style);font-weight: var(--shiki-code-theme-one-light-font-weight);text-decoration: var(--shiki-code-theme-one-light-text-decoration);}html .code-theme-one-dark .shiki span {color: var(--shiki-code-theme-one-dark);background: var(--shiki-code-theme-one-dark-bg);font-style: var(--shiki-code-theme-one-dark-font-style);font-weight: var(--shiki-code-theme-one-dark-font-weight);text-decoration: var(--shiki-code-theme-one-dark-text-decoration);}html.code-theme-one-dark .shiki span {color: var(--shiki-code-theme-one-dark);background: var(--shiki-code-theme-one-dark-bg);font-style: var(--shiki-code-theme-one-dark-font-style);font-weight: var(--shiki-code-theme-one-dark-font-weight);text-decoration: var(--shiki-code-theme-one-dark-text-decoration);}html .code-theme-material-light .shiki span {color: var(--shiki-code-theme-material-light);background: var(--shiki-code-theme-material-light-bg);font-style: var(--shiki-code-theme-material-light-font-style);font-weight: var(--shiki-code-theme-material-light-font-weight);text-decoration: var(--shiki-code-theme-material-light-text-decoration);}html.code-theme-material-light .shiki span {color: var(--shiki-code-theme-material-light);background: var(--shiki-code-theme-material-light-bg);font-style: var(--shiki-code-theme-material-light-font-style);font-weight: var(--shiki-code-theme-material-light-font-weight);text-decoration: var(--shiki-code-theme-material-light-text-decoration);}html .code-theme-material-dark .shiki span {color: var(--shiki-code-theme-material-dark);background: var(--shiki-code-theme-material-dark-bg);font-style: var(--shiki-code-theme-material-dark-font-style);font-weight: var(--shiki-code-theme-material-dark-font-weight);text-decoration: var(--shiki-code-theme-material-dark-text-decoration);}html.code-theme-material-dark .shiki span {color: var(--shiki-code-theme-material-dark);background: var(--shiki-code-theme-material-dark-bg);font-style: var(--shiki-code-theme-material-dark-font-style);font-weight: var(--shiki-code-theme-material-dark-font-weight);text-decoration: var(--shiki-code-theme-material-dark-text-decoration);}html .code-theme-min-light .shiki span {color: var(--shiki-code-theme-min-light);background: var(--shiki-code-theme-min-light-bg);font-style: var(--shiki-code-theme-min-light-font-style);font-weight: var(--shiki-code-theme-min-light-font-weight);text-decoration: var(--shiki-code-theme-min-light-text-decoration);}html.code-theme-min-light .shiki span {color: var(--shiki-code-theme-min-light);background: var(--shiki-code-theme-min-light-bg);font-style: var(--shiki-code-theme-min-light-font-style);font-weight: var(--shiki-code-theme-min-light-font-weight);text-decoration: var(--shiki-code-theme-min-light-text-decoration);}html .code-theme-min-dark .shiki span {color: var(--shiki-code-theme-min-dark);background: var(--shiki-code-theme-min-dark-bg);font-style: var(--shiki-code-theme-min-dark-font-style);font-weight: var(--shiki-code-theme-min-dark-font-weight);text-decoration: var(--shiki-code-theme-min-dark-text-decoration);}html.code-theme-min-dark .shiki span {color: var(--shiki-code-theme-min-dark);background: var(--shiki-code-theme-min-dark-bg);font-style: var(--shiki-code-theme-min-dark-font-style);font-weight: var(--shiki-code-theme-min-dark-font-weight);text-decoration: var(--shiki-code-theme-min-dark-text-decoration);}",{"title":465,"searchDepth":503,"depth":503,"links":683},[684,685,686,687,688,689,690,691,692],{"id":442,"depth":503,"text":442},{"id":471,"depth":503,"text":471},{"id":531,"depth":503,"text":531},{"id":555,"depth":503,"text":555},{"id":566,"depth":503,"text":566},{"id":574,"depth":503,"text":574},{"id":602,"depth":503,"text":602},{"id":614,"depth":503,"text":614},{"id":623,"depth":503,"text":623},"用一个文档页面实际体验摘要、折叠、引用、指标、时间线、检查清单及图片预览。","md",{},{"icon":145},"---\ntitle: MDC 组件交互演示\ndescription: 用一个文档页面实际体验摘要、折叠、引用、指标、时间线、检查清单及图片预览。\nnavigation:\n  icon: lucide-mouse-pointer-click\n---\n\n这是实际渲染的演示页，所有块均写在这个 Markdown 文件中。属性与复制代码见 [内容块说明](\u002Fdocs\u002F简单文档\u002Fcomponents\u002Fcontent-blocks)，写法见 [MDC 语法](\u002Fdocs\u002F简单文档\u002Fcomponents\u002Fmdc-guide)。下列进度和数值是演示数据。\n\n## 文章摘要\n\n::article-summary{title=\"示例文章摘要\"}\n- 同一套组件可以用于 **博客和文档**。\n- 文章正文保持 Markdown 的可读性与可复制性。\n\n#takeaway\n下一步：试着展开说明、勾选清单并查看大图。\n::\n\n## 折叠说明\n\n::expand-box{title=\"查看验证命令\"}\n下面的命令是可复制的文本，展开后无需加载外部服务。\n\n```bash\npnpm content:check\npnpm test:unit\n```\n\n[返回组件索引](\u002Fdocs\u002F简单文档\u002Fcomponents\u002Fapi)\n::\n\n::expand-box{title=\"默认展开的说明\" :open=\"true\"}\n`open` 是布尔属性，可以用 YAML 或 `:open=\"true\"` 设置。\n::\n\n## 参考资料\n\n::link-card{title=\"进入 MDC 写法说明\" to=\"\u002Fdocs\u002F简单文档\u002Fcomponents\u002Fmdc-guide\" description=\"适合第一次在 Markdown 中使用 Vue 组件的作者。\"}\n正文中还可以放 [组件 API](\u002Fdocs\u002F简单文档\u002Fcomponents\u002Fapi)，它是独立链接。\n::\n\n::link-card{title=\"Nuxt Content 官方文档\" to=\"https:\u002F\u002Fcontent.nuxt.com\" target=\"_blank\" icon=\"lucide-external-link\"}\n打开新窗口查看上游文档。\n::\n\n## 署名引用\n\n::quote-block{author=\"示例作者\" source=\"MDC 写作笔记\" to=\"\u002Fdocs\u002F简单文档\u002Fcomponents\u002Fmdc-guide\"}\n让文章解释一个问题，让组件帮助读者完成一步操作。\n::\n\n## 指标展示\n\n::stat-grid\n---\ncolumns: 3\nitems:\n  - label: 示例节点\n    value: 12\n  - label: 检查项\n    value: 8\n  - label: 结果\n    value: 通过\n    description: 仅用于布局展示\n---\n::\n\n## 过程时间线\n\n:::doc-timeline{label=\"示例排查时间线\"}\n::timeline-item{title=\"记录现象\" date=\"09:00\" datetime=\"2026-10-04T09:00:00+08:00\"}\n描述触发条件与影响范围。\n::\n::timeline-item{title=\"验证修复\" date=\"09:30\" datetime=\"2026-10-04T09:30:00+08:00\"}\n运行**回归检查**，确认问题不会再次出现。\n::\n:::\n\n## 可操作清单\n\n::task-checklist\n---\ntitle: 阅读练习\nitems:\n  - label: 了解 MDC 的块语法\n    checked: true\n  - label: 尝试勾选这一项\n    description: 完成数会同步更新\n  - label: 打开下面的图片预览\n---\n::\n\n::task-checklist\n---\ntitle: 只读演示\nreadonly: true\nitems:\n  - label: 已完成的示例检查\n    checked: true\n  - label: 待完成的示例检查\n---\n::\n\n## 图库与预览\n\n::image-gallery\n---\ntitle: MDC 工作流\ncolumns: 2\nimages:\n  - src: \u002Fimages\u002Fmdc\u002Frender-flow.svg\n    alt: MDC 渲染流程图\n    caption: Markdown → Content AST → Vue 组件\n  - src: \u002Fimages\u002Fmdc\u002Fpublish-flow.svg\n    alt: 文档发布流程图\n    caption: 编写 → 验证 → 发布\n---\n::\n\n## 原有组件兼容\n\n::alert{title=\"旧文章提醒\" type=\"warning\"}\n原有 `::alert` 语法现在有明确的 Vue 实现，**Markdown 正文**和类型颜色均可显示。\n::\n\n::e-card{title=\"原有卡片\" description=\"已有组件继续可用。\" icon=\"lucide-component\"}\n这是 `ECard` 的默认插槽。\n::\n\n::button-link{to=\"\u002Fdocs\u002F简单文档\u002Fcomponents\u002Fapi\" rightIcon=\"lucide-arrow-right\"}\n查看全部组件\n::\n\n:::tabs\n::tabs-item{label=\"Markdown\"}\n使用 `::组件名` 写内容。\n::\n::tabs-item{label=\"Vue\"}\n通过 props 与 slot 接收内容。\n::\n:::\n",{"title":142,"description":693},"wkrVOu8Fi1zEtt_Uk6LjA-C1lj1wICzCkow8Jf-N4q0",[701,703],{"title":137,"path":138,"stem":139,"description":702,"icon":140,"children":-1},"在 Markdown 中传入 Vue props、插槽和嵌套组件，并了解本站的组件注册方式。",{"title":147,"path":148,"stem":149,"description":704,"children":-1},"嵌入 StackBlitz 或 CodeSandbox 示例项目的组件。",1791307030242]