[{"data":1,"prerenderedAt":1372},["ShallowReactive",2],{"navigation":3,"blogNavigation":232,"page-\u002Fdocs\u002F%E7%AE%80%E5%8D%95%E6%96%87%E6%A1%A3\u002Fcomponents\u002Fmdc-guide":418,"\u002Fdocs\u002F%E7%AE%80%E5%8D%95%E6%96%87%E6%A1%A3\u002Fcomponents\u002Fmdc-guide-surround":1367},[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":137,"badges":420,"body":421,"date":420,"description":1360,"draft":57,"extension":1361,"fullpage":57,"icon":420,"links":420,"meta":1362,"navBadges":420,"navigation":1363,"path":138,"rawbody":1364,"seo":1365,"stem":139,"updated":420,"__hash__":1366},"docs\u002Fdocs\u002F1.简单文档\u002F5.components\u002Fmdc-guide.md",null,{"type":422,"value":423,"toc":1351},"minimark",[424,446,451,461,478,546,549,563,629,632,642,733,740,743,846,849,860,880,939,942,945,964,1075,1079,1086,1256,1278,1288,1302,1305,1331,1347],[425,426,427,428,432,433,436,437,440,441,445],"p",{},"MDC 让文章作者在 Markdown 中使用 Vue 组件。本文中的示例都可用于 ",[429,430,431],"code",{},"content\u002Fdocs\u002F"," 和 ",[429,434,435],{},"content\u002Fblog\u002F","；渲染仍由页面里的 ",[429,438,439],{},"ContentRenderer"," 完成。完整组件索引见 ",[442,443,69],"a",{"href":444},"\u002Fdocs\u002F%E7%AE%80%E5%8D%95%E6%96%87%E6%A1%A3\u002Fcomponents\u002Fapi","。",[447,448,450],"h2",{"id":449},"块组件与-markdown-正文","块组件与 Markdown 正文",[425,452,453,456,457,460],{},[429,454,455],{},"::组件名"," 到配对的 ",[429,458,459],{},"::"," 是一个组件块。默认插槽里的段落、列表、链接和代码块继续按 Markdown 渲染。",[462,463,465],"article-summary",{"title":464},"本页要点",[466,467,468,472,475],"ul",{},[469,470,471],"li",{},"普通文本、Markdown 和 Vue 组件可以组合。",[469,473,474],{},"属性负责数据，插槽负责富文本。",[469,476,477],{},"复杂数组推荐写成组件内的 YAML。",[479,480,485],"pre",{"className":481,"code":482,"language":483,"meta":484,"style":484},"language-mdc 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","::article-summary{title=\"本页要点\"}\n- 普通文本、Markdown 和 Vue 组件可以组合。\n- 属性负责数据，插槽负责富文本。\n::\n","mdc","",[429,486,487,521,532,540],{"__ignoreMap":484},[488,489,492,495,498,501,505,509,513,516,518],"span",{"class":490,"line":491},"line",1,[488,493,459],{"class":494},"s4Bi8",[488,496,462],{"class":497},"spV5I",[488,499,500],{"class":494},"{",[488,502,504],{"class":503},"shR_7","title",[488,506,508],{"class":507},"stNAY","=",[488,510,512],{"class":511},"sLXf0","\"",[488,514,464],{"class":515},"sCtJb",[488,517,512],{"class":511},[488,519,520],{"class":494},"}\n",[488,522,524,528],{"class":490,"line":523},2,[488,525,527],{"class":526},"s67oU","-",[488,529,531],{"class":530},"sw9Yk"," 普通文本、Markdown 和 Vue 组件可以组合。\n",[488,533,535,537],{"class":490,"line":534},3,[488,536,527],{"class":526},[488,538,539],{"class":530}," 属性负责数据，插槽负责富文本。\n",[488,541,543],{"class":490,"line":542},4,[488,544,545],{"class":494},"::\n",[447,547,548],{"id":548},"行内组件",[425,550,551,552,557,558,445],{},"单个冒号用于行内组件，例如版本 ",[553,554,556],"badge",{"color":555},"info","Nuxt 4"," 和图标 ",[559,560],"smart-icon",{"name":561,"size":562},"lucide-sparkles",18,[479,564,566],{"className":481,"code":565,"language":483,"meta":484,"style":484},"版本 :badge[Nuxt 4]{color=\"info\"}\n图标 :smart-icon{name=\"lucide-sparkles\" size=18}\n",[429,567,568,596],{"__ignoreMap":484},[488,569,570,573,576,578,581,583,586,588,590,592,594],{"class":490,"line":491},[488,571,572],{"class":530},"版本 ",[488,574,575],{"class":494},":",[488,577,553],{"class":497},[488,579,580],{"class":530},"[Nuxt 4]",[488,582,500],{"class":494},[488,584,585],{"class":503},"color",[488,587,508],{"class":507},[488,589,512],{"class":511},[488,591,555],{"class":515},[488,593,512],{"class":511},[488,595,520],{"class":494},[488,597,598,601,603,605,607,610,612,614,616,618,621,623,627],{"class":490,"line":523},[488,599,600],{"class":530},"图标 ",[488,602,575],{"class":494},[488,604,559],{"class":497},[488,606,500],{"class":494},[488,608,609],{"class":503},"name",[488,611,508],{"class":507},[488,613,512],{"class":511},[488,615,561],{"class":515},[488,617,512],{"class":511},[488,619,620],{"class":503}," size",[488,622,508],{"class":507},[488,624,626],{"class":625},"s254i","18",[488,628,520],{"class":494},[447,630,631],{"id":631},"简单属性与结构化属性",[425,633,634,635,638,639,641],{},"字符串写在 ",[429,636,637],{},"{}"," 中。数字、布尔值、数组与对象使用 ",[429,640,575],{}," 绑定：",[479,643,645],{"className":481,"code":644,"language":483,"meta":484,"style":484},"::expand-box{title=\"默认展开\" :open=\"true\"}\n正文内容。\n::\n\n::stat-grid{:items='[{\"label\":\"组件\",\"value\":20},{\"label\":\"集合\",\"value\":2}]' :columns=\"2\"}\n::\n",[429,646,647,681,686,690,696,728],{"__ignoreMap":484},[488,648,649,651,654,656,658,660,662,665,667,670,672,674,677,679],{"class":490,"line":491},[488,650,459],{"class":494},[488,652,653],{"class":497},"expand-box",[488,655,500],{"class":494},[488,657,504],{"class":503},[488,659,508],{"class":507},[488,661,512],{"class":511},[488,663,664],{"class":515},"默认展开",[488,666,512],{"class":511},[488,668,669],{"class":503}," :open",[488,671,508],{"class":507},[488,673,512],{"class":511},[488,675,676],{"class":515},"true",[488,678,512],{"class":511},[488,680,520],{"class":494},[488,682,683],{"class":490,"line":523},[488,684,685],{"class":530},"正文内容。\n",[488,687,688],{"class":490,"line":534},[488,689,545],{"class":494},[488,691,692],{"class":490,"line":542},[488,693,695],{"emptyLinePlaceholder":694},true,"\n",[488,697,699,701,704,706,709,711,714,717,719,721,724,726],{"class":490,"line":698},5,[488,700,459],{"class":494},[488,702,703],{"class":497},"stat-grid",[488,705,500],{"class":494},[488,707,708],{"class":503},":items",[488,710,508],{"class":507},[488,712,713],{"class":503},"'[{\"label\":\"组件\",\"value\":20},{\"label\":\"集合\",\"value\":2}]'",[488,715,716],{"class":503}," :columns",[488,718,508],{"class":507},[488,720,512],{"class":511},[488,722,723],{"class":515},"2",[488,725,512],{"class":511},[488,727,520],{"class":494},[488,729,731],{"class":490,"line":730},6,[488,732,545],{"class":494},[425,734,735,736,739],{},"复杂数据用组件内的 ",[429,737,738],{},"---"," YAML 区域，避免长 JSON 和引号转义。这个区域设置该组件的 props，与文件顶部设置文章元信息的 frontmatter 不同。",[703,741],{":columns":723,":items":742},"[{\"label\":\"内容集合\",\"value\":2,\"description\":\"文档与博客\"},{\"label\":\"公共自定义组件\",\"value\":27,\"description\":\"包含时间线条目与兼容入口\"}]",[479,744,746],{"className":481,"code":745,"language":483,"meta":484,"style":484},"::stat-grid\n---\ncolumns: 2\nitems:\n  - label: 内容集合\n    value: 2\n    description: 文档与博客\n  - label: 公共自定义组件\n    value: 27\n---\n::\n",[429,747,748,755,760,772,780,794,803,814,826,836,841],{"__ignoreMap":484},[488,749,750,752],{"class":490,"line":491},[488,751,459],{"class":494},[488,753,754],{"class":497},"stat-grid\n",[488,756,757],{"class":490,"line":523},[488,758,759],{"class":530},"---\n",[488,761,762,766,768],{"class":490,"line":534},[488,763,765],{"class":764},"sBSHF","columns",[488,767,575],{"class":507},[488,769,771],{"class":770},"s_Zq6"," 2\n",[488,773,774,777],{"class":490,"line":542},[488,775,776],{"class":764},"items",[488,778,779],{"class":507},":\n",[488,781,782,786,789,791],{"class":490,"line":698},[488,783,785],{"class":784},"sIQTy","  -",[488,787,788],{"class":764}," label",[488,790,575],{"class":507},[488,792,793],{"class":515}," 内容集合\n",[488,795,796,799,801],{"class":490,"line":730},[488,797,798],{"class":764},"    value",[488,800,575],{"class":507},[488,802,771],{"class":770},[488,804,806,809,811],{"class":490,"line":805},7,[488,807,808],{"class":764},"    description",[488,810,575],{"class":507},[488,812,813],{"class":515}," 文档与博客\n",[488,815,817,819,821,823],{"class":490,"line":816},8,[488,818,785],{"class":784},[488,820,788],{"class":764},[488,822,575],{"class":507},[488,824,825],{"class":515}," 公共自定义组件\n",[488,827,829,831,833],{"class":490,"line":828},9,[488,830,798],{"class":764},[488,832,575],{"class":507},[488,834,835],{"class":770}," 27\n",[488,837,839],{"class":490,"line":838},10,[488,840,759],{"class":530},[488,842,844],{"class":490,"line":843},11,[488,845,545],{"class":494},[447,847,848],{"id":848},"命名插槽",[425,850,851,852,855,856,859],{},"组件内部的 ",[429,853,854],{},"#takeaway"," 把后面的 Markdown 交给同名插槽。这里的 ",[429,857,858],{},"#"," 是插槽标记，不是文章标题。",[462,861,863,870],{"title":862},"排版建议",[425,864,865,866,445],{},"默认插槽适合写",[867,868,869],"strong",{},"背景与重点",[871,872,873],"template",{"v-slot:takeaway":484},[425,874,875,876,879],{},"结论：把一句行动建议放进 ",[429,877,878],{},"takeaway"," 插槽。",[479,881,883],{"className":481,"code":882,"language":483,"meta":484,"style":484},"::article-summary{title=\"排版建议\"}\n默认插槽适合写**背景与重点**。\n\n#takeaway\n结论：把一句行动建议放进 takeaway 插槽。\n::\n",[429,884,885,905,921,925,930,935],{"__ignoreMap":484},[488,886,887,889,891,893,895,897,899,901,903],{"class":490,"line":491},[488,888,459],{"class":494},[488,890,462],{"class":497},[488,892,500],{"class":494},[488,894,504],{"class":503},[488,896,508],{"class":507},[488,898,512],{"class":511},[488,900,862],{"class":515},[488,902,512],{"class":511},[488,904,520],{"class":494},[488,906,907,909,913,916,918],{"class":490,"line":523},[488,908,865],{"class":530},[488,910,912],{"class":911},"sovfr","**",[488,914,869],{"class":915},"sr12r",[488,917,912],{"class":911},[488,919,920],{"class":530},"。\n",[488,922,923],{"class":490,"line":534},[488,924,695],{"emptyLinePlaceholder":694},[488,926,927],{"class":490,"line":542},[488,928,929],{"class":503},"#takeaway\n",[488,931,932],{"class":490,"line":698},[488,933,934],{"class":530},"结论：把一句行动建议放进 takeaway 插槽。\n",[488,936,937],{"class":490,"line":730},[488,938,545],{"class":494},[447,940,941],{"id":941},"嵌套组件",[425,943,944],{},"外层使用更多冒号，可清楚区分结束位置。每个组件的开始和结束冒号数保持一致。",[946,947,949,957],"doc-timeline",{"label":948},"写作流程",[950,951,954],"timeline-item",{"date":952,"title":953},"第一步","准备内容",[425,955,956],{},"确定文章读者与结论。",[950,958,961],{"date":959,"title":960},"第二步","补充示例",[425,962,963],{},"加入代码、图表和可操作的清单。",[479,965,967],{"className":481,"code":966,"language":483,"meta":484,"style":484},":::doc-timeline{label=\"写作流程\"}\n::timeline-item{title=\"准备内容\" date=\"第一步\"}\n确定文章读者与结论。\n::\n::timeline-item{title=\"补充示例\" date=\"第二步\"}\n加入代码、图表和可操作的清单。\n::\n:::\n",[429,968,969,991,1022,1027,1031,1061,1066,1070],{"__ignoreMap":484},[488,970,971,974,976,978,981,983,985,987,989],{"class":490,"line":491},[488,972,973],{"class":494},":::",[488,975,946],{"class":497},[488,977,500],{"class":494},[488,979,980],{"class":503},"label",[488,982,508],{"class":507},[488,984,512],{"class":511},[488,986,948],{"class":515},[488,988,512],{"class":511},[488,990,520],{"class":494},[488,992,993,995,997,999,1001,1003,1005,1007,1009,1012,1014,1016,1018,1020],{"class":490,"line":523},[488,994,459],{"class":494},[488,996,950],{"class":497},[488,998,500],{"class":494},[488,1000,504],{"class":503},[488,1002,508],{"class":507},[488,1004,512],{"class":511},[488,1006,953],{"class":515},[488,1008,512],{"class":511},[488,1010,1011],{"class":503}," date",[488,1013,508],{"class":507},[488,1015,512],{"class":511},[488,1017,952],{"class":515},[488,1019,512],{"class":511},[488,1021,520],{"class":494},[488,1023,1024],{"class":490,"line":534},[488,1025,1026],{"class":530},"确定文章读者与结论。\n",[488,1028,1029],{"class":490,"line":542},[488,1030,545],{"class":494},[488,1032,1033,1035,1037,1039,1041,1043,1045,1047,1049,1051,1053,1055,1057,1059],{"class":490,"line":698},[488,1034,459],{"class":494},[488,1036,950],{"class":497},[488,1038,500],{"class":494},[488,1040,504],{"class":503},[488,1042,508],{"class":507},[488,1044,512],{"class":511},[488,1046,960],{"class":515},[488,1048,512],{"class":511},[488,1050,1011],{"class":503},[488,1052,508],{"class":507},[488,1054,512],{"class":511},[488,1056,959],{"class":515},[488,1058,512],{"class":511},[488,1060,520],{"class":494},[488,1062,1063],{"class":490,"line":730},[488,1064,1065],{"class":530},"加入代码、图表和可操作的清单。\n",[488,1067,1068],{"class":490,"line":805},[488,1069,545],{"class":494},[488,1071,1072],{"class":490,"line":816},[488,1073,1074],{"class":494},":::\n",[447,1076,1078],{"id":1077},"vue-实现与注册","Vue 实现与注册",[425,1080,1081,1082,1085],{},"本站组件位于 ",[429,1083,1084],{},"app\u002Fcomponents\u002Fcontent\u002F","。例子：",[479,1087,1092],{"className":1088,"code":1089,"filename":1090,"language":1091,"meta":484,"style":484},"language-vue 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","\u003Ctemplate>\n  \u003Caside>\n    \u003Cp>{{ title }}\u003C\u002Fp>\n    \u003Cslot \u002F>\n    \u003Cslot name=\"takeaway\" \u002F>\n  \u003C\u002Faside>\n\u003C\u002Ftemplate>\n\n\u003Cscript setup lang=\"ts\">\ndefineProps\u003C{ title?: string }>()\n\u003C\u002Fscript>\n","app\u002Fcomponents\u002Fcontent\u002FArticleSummary.vue","vue",[429,1093,1094,1104,1114,1134,1147,1168,1177,1185,1189,1213,1248],{"__ignoreMap":484},[488,1095,1096,1099,1101],{"class":490,"line":491},[488,1097,1098],{"class":494},"\u003C",[488,1100,871],{"class":497},[488,1102,1103],{"class":494},">\n",[488,1105,1106,1109,1112],{"class":490,"line":523},[488,1107,1108],{"class":494},"  \u003C",[488,1110,1111],{"class":497},"aside",[488,1113,1103],{"class":494},[488,1115,1116,1119,1121,1124,1127,1130,1132],{"class":490,"line":534},[488,1117,1118],{"class":494},"    \u003C",[488,1120,425],{"class":497},[488,1122,1123],{"class":494},">",[488,1125,1126],{"class":530},"{{ title }}",[488,1128,1129],{"class":494},"\u003C\u002F",[488,1131,425],{"class":497},[488,1133,1103],{"class":494},[488,1135,1136,1138,1141,1145],{"class":490,"line":542},[488,1137,1118],{"class":494},[488,1139,1140],{"class":497},"slot",[488,1142,1144],{"class":1143},"s02sO"," \u002F",[488,1146,1103],{"class":494},[488,1148,1149,1151,1153,1156,1158,1160,1162,1164,1166],{"class":490,"line":698},[488,1150,1118],{"class":494},[488,1152,1140],{"class":497},[488,1154,1155],{"class":503}," name",[488,1157,508],{"class":507},[488,1159,512],{"class":511},[488,1161,878],{"class":515},[488,1163,512],{"class":511},[488,1165,1144],{"class":1143},[488,1167,1103],{"class":494},[488,1169,1170,1173,1175],{"class":490,"line":730},[488,1171,1172],{"class":494},"  \u003C\u002F",[488,1174,1111],{"class":497},[488,1176,1103],{"class":494},[488,1178,1179,1181,1183],{"class":490,"line":805},[488,1180,1129],{"class":494},[488,1182,871],{"class":497},[488,1184,1103],{"class":494},[488,1186,1187],{"class":490,"line":816},[488,1188,695],{"emptyLinePlaceholder":694},[488,1190,1191,1193,1196,1199,1202,1204,1206,1209,1211],{"class":490,"line":828},[488,1192,1098],{"class":494},[488,1194,1195],{"class":497},"script",[488,1197,1198],{"class":503}," setup",[488,1200,1201],{"class":503}," lang",[488,1203,508],{"class":507},[488,1205,512],{"class":511},[488,1207,1208],{"class":515},"ts",[488,1210,512],{"class":511},[488,1212,1103],{"class":494},[488,1214,1215,1219,1222,1224,1228,1232,1235,1239,1242,1244],{"class":490,"line":838},[488,1216,1218],{"class":1217},"sORj3","defineProps",[488,1220,1098],{"class":1221},"szOsf",[488,1223,500],{"class":784},[488,1225,1227],{"class":1226},"s-TM-"," title",[488,1229,1231],{"class":1230},"snVmB","?",[488,1233,575],{"class":1234},"sgh53",[488,1236,1238],{"class":1237},"smpFa"," string",[488,1240,1241],{"class":784}," }",[488,1243,1123],{"class":1221},[488,1245,1247],{"class":1246},"sZ-Ck","()\n",[488,1249,1250,1252,1254],{"class":490,"line":843},[488,1251,1129],{"class":494},[488,1253,1195],{"class":497},[488,1255,1103],{"class":494},[425,1257,1258,1259,1262,1263,1266,1267,1270,1271,1274,1275,445],{},"Nuxt Content 会扫描内容组件目录。本站还通过 ",[429,1260,1261],{},"app\u002Fplugins\u002Fcontent-components.ts"," 显式注册公共名称，",[429,1264,1265],{},"shared\u002Fmdc-components.ts"," 保持 Studio 组件选择器一致；教学示例目录使用按需异步注册。Nuxt UI 的 ",[429,1268,1269],{},"::tabs","、",[429,1272,1273],{},"::callout"," 等由模块配置映射到 ",[429,1276,1277],{},"Prose*",[425,1279,1280,1281,1283,1284,1287],{},"新增公共组件时同步三个位置：Vue 文件、注册插件、Studio 名称清单，然后补充实例文档。组件放到其他目录时，需要全局注册或通过 ",[429,1282,439],{}," 的 ",[429,1285,1286],{},"components"," 映射提供，不能仅依赖普通模板的自动导入。",[425,1289,1290,1291,1294,1295,1298,1299,445],{},"在 ",[429,1292,1293],{},"\u003Cspan>"," 或标题里放插槽，可用 ",[429,1296,1297],{},"\u003Cslot mdc-unwrap=\"p\" \u002F>"," 去掉默认段落包装。需要段落、列表和代码的正文容器应保留完整 ",[429,1300,1301],{},"\u003Cslot \u002F>",[447,1303,1304],{"id":1304},"编写约定",[466,1306,1307,1316,1322,1325,1328],{},[469,1308,1309,1310,1270,1313,445],{},"组件属性使用明确类型；组件中不访问服务端不存在的 ",[429,1311,1312],{},"window",[429,1314,1315],{},"document",[469,1317,1318,1319,445],{},"路由链接使用安全 URL 校验；新窗口链接保留 ",[429,1320,1321],{},"noopener noreferrer",[469,1323,1324],{},"表单控件要有可见标签，折叠和图片预览必须能用键盘操作。",[469,1326,1327],{},"检查清单仅在当前页面保存状态；刷新后恢复 Markdown 的初始数据。",[469,1329,1330],{},"Markdown\u002FMDC 作者属于受信任的内容贡献者，组件功能不能代替内容访问控制。",[425,1332,1333,1334,1340,1341,1346],{},"相关语法以 ",[442,1335,1339],{"href":1336,"rel":1337},"https:\u002F\u002Fcontent.nuxt.com\u002Fdocs\u002Ffiles\u002Fmarkdown",[1338],"nofollow","Nuxt Content Markdown 文档"," 与 ",[442,1342,1345],{"href":1343,"rel":1344},"https:\u002F\u002Fcontent.nuxt.com\u002Fdocs\u002Fcomponents\u002Fcontent-renderer",[1338],"ContentRenderer API"," 为准。",[1348,1349,1350],"style",{},"html pre.shiki code .s4Bi8, html code.shiki .s4Bi8{--shiki-light:#24292E;--shiki-default:#24292E;--shiki-dark:#E1E4E8;--shiki-code-theme-vitesse-light:#999999;--shiki-code-theme-vitesse-dark:#666666;--shiki-code-theme-catppuccin-light:#179299;--shiki-code-theme-catppuccin-dark:#94E2D5;--shiki-code-theme-one-light:#383A42;--shiki-code-theme-one-dark:#ABB2BF;--shiki-code-theme-material-light:#39ADB5;--shiki-code-theme-material-dark:#89DDFF;--shiki-code-theme-min-light:#24292EFF;--shiki-code-theme-min-dark:#B392F0}html pre.shiki code .spV5I, html code.shiki .spV5I{--shiki-light:#22863A;--shiki-default:#22863A;--shiki-dark:#85E89D;--shiki-code-theme-vitesse-light:#1E754F;--shiki-code-theme-vitesse-dark:#4D9375;--shiki-code-theme-catppuccin-light:#1E66F5;--shiki-code-theme-catppuccin-dark:#89B4FA;--shiki-code-theme-one-light:#E45649;--shiki-code-theme-one-dark:#E06C75;--shiki-code-theme-material-light:#E53935;--shiki-code-theme-material-dark:#F07178;--shiki-code-theme-min-light:#22863A;--shiki-code-theme-min-dark:#FFAB70}html pre.shiki code .shR_7, html code.shiki .shR_7{--shiki-light:#6F42C1;--shiki-default:#6F42C1;--shiki-dark:#B392F0;--shiki-code-theme-vitesse-light:#B07D48;--shiki-code-theme-vitesse-dark:#BD976A;--shiki-code-theme-catppuccin-light:#DF8E1D;--shiki-code-theme-catppuccin-dark:#F9E2AF;--shiki-code-theme-one-light:#986801;--shiki-code-theme-one-dark:#D19A66;--shiki-code-theme-material-light:#9C3EDA;--shiki-code-theme-material-dark:#C792EA;--shiki-code-theme-min-light:#6F42C1;--shiki-code-theme-min-dark:#B392F0}html pre.shiki code .stNAY, html code.shiki .stNAY{--shiki-light:#24292E;--shiki-default:#24292E;--shiki-dark:#E1E4E8;--shiki-code-theme-vitesse-light:#999999;--shiki-code-theme-vitesse-dark:#666666;--shiki-code-theme-catppuccin-light:#179299;--shiki-code-theme-catppuccin-dark:#94E2D5;--shiki-code-theme-one-light:#383A42;--shiki-code-theme-one-dark:#ABB2BF;--shiki-code-theme-material-light:#39ADB5;--shiki-code-theme-material-dark:#89DDFF;--shiki-code-theme-min-light:#D32F2F;--shiki-code-theme-min-dark:#F97583}html pre.shiki code .sLXf0, html code.shiki .sLXf0{--shiki-light:#032F62;--shiki-default:#032F62;--shiki-dark:#9ECBFF;--shiki-code-theme-vitesse-light:#B5695977;--shiki-code-theme-vitesse-dark:#C98A7D77;--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:#39ADB5;--shiki-code-theme-material-dark:#89DDFF;--shiki-code-theme-min-light:#22863A;--shiki-code-theme-min-dark:#FFAB70}html pre.shiki code .sCtJb, html code.shiki .sCtJb{--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:#22863A;--shiki-code-theme-min-dark:#FFAB70}html pre.shiki code .s67oU, html code.shiki .s67oU{--shiki-light:#E36209;--shiki-default:#E36209;--shiki-dark:#FFAB70;--shiki-code-theme-vitesse-light:#A65E2B;--shiki-code-theme-vitesse-dark:#D4976C;--shiki-code-theme-catppuccin-light:#179299;--shiki-code-theme-catppuccin-dark:#94E2D5;--shiki-code-theme-one-light:#383A42;--shiki-code-theme-one-dark:#E5C07B;--shiki-code-theme-material-light:#39ADB5;--shiki-code-theme-material-dark:#89DDFF;--shiki-code-theme-min-light:#24292EFF;--shiki-code-theme-min-dark:#B392F0}html pre.shiki code .sw9Yk, html code.shiki .sw9Yk{--shiki-light:#24292E;--shiki-default:#24292E;--shiki-dark:#E1E4E8;--shiki-code-theme-vitesse-light:#393A34;--shiki-code-theme-vitesse-dark:#DBD7CAEE;--shiki-code-theme-catppuccin-light:#4C4F69;--shiki-code-theme-catppuccin-dark:#CDD6F4;--shiki-code-theme-one-light:#383A42;--shiki-code-theme-one-dark:#ABB2BF;--shiki-code-theme-material-light:#90A4AE;--shiki-code-theme-material-dark:#BABED8;--shiki-code-theme-min-light:#24292EFF;--shiki-code-theme-min-dark:#B392F0}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);}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 pre.shiki code .sBSHF, html code.shiki .sBSHF{--shiki-light:#22863A;--shiki-default:#22863A;--shiki-dark:#85E89D;--shiki-code-theme-vitesse-light:#998418;--shiki-code-theme-vitesse-dark:#B8A965;--shiki-code-theme-catppuccin-light:#1E66F5;--shiki-code-theme-catppuccin-dark:#89B4FA;--shiki-code-theme-one-light:#E45649;--shiki-code-theme-one-dark:#E06C75;--shiki-code-theme-material-light:#E53935;--shiki-code-theme-material-dark:#F07178;--shiki-code-theme-min-light:#D32F2F;--shiki-code-theme-min-dark:#F8F8F8}html pre.shiki code .s_Zq6, html code.shiki .s_Zq6{--shiki-light:#005CC5;--shiki-default:#005CC5;--shiki-dark:#79B8FF;--shiki-code-theme-vitesse-light:#2F798A;--shiki-code-theme-vitesse-dark:#4C9A91;--shiki-code-theme-catppuccin-light:#FE640B;--shiki-code-theme-catppuccin-dark:#FAB387;--shiki-code-theme-one-light:#986801;--shiki-code-theme-one-dark:#D19A66;--shiki-code-theme-material-light:#F76D47;--shiki-code-theme-material-dark:#F78C6C;--shiki-code-theme-min-light:#1976D2;--shiki-code-theme-min-dark:#F8F8F8}html pre.shiki code .sIQTy, html code.shiki .sIQTy{--shiki-light:#24292E;--shiki-default:#24292E;--shiki-dark:#E1E4E8;--shiki-code-theme-vitesse-light:#999999;--shiki-code-theme-vitesse-dark:#666666;--shiki-code-theme-catppuccin-light:#7C7F93;--shiki-code-theme-catppuccin-dark:#9399B2;--shiki-code-theme-one-light:#383A42;--shiki-code-theme-one-dark:#ABB2BF;--shiki-code-theme-material-light:#39ADB5;--shiki-code-theme-material-dark:#89DDFF;--shiki-code-theme-min-light:#24292EFF;--shiki-code-theme-min-dark:#B392F0}html pre.shiki code .sovfr, html code.shiki .sovfr{--shiki-light:#24292E;--shiki-light-font-weight:bold;--shiki-default:#24292E;--shiki-default-font-weight:bold;--shiki-dark:#E1E4E8;--shiki-dark-font-weight:bold;--shiki-code-theme-vitesse-light:#999999;--shiki-code-theme-vitesse-light-font-weight:bold;--shiki-code-theme-vitesse-dark:#666666;--shiki-code-theme-vitesse-dark-font-weight:bold;--shiki-code-theme-catppuccin-light:#7C7F93;--shiki-code-theme-catppuccin-light-font-weight:inherit;--shiki-code-theme-catppuccin-dark:#9399B2;--shiki-code-theme-catppuccin-dark-font-weight:inherit;--shiki-code-theme-one-light:#986801;--shiki-code-theme-one-light-font-weight:bold;--shiki-code-theme-one-dark:#D19A66;--shiki-code-theme-one-dark-font-weight:inherit;--shiki-code-theme-material-light:#39ADB5;--shiki-code-theme-material-light-font-weight:bold;--shiki-code-theme-material-dark:#89DDFF;--shiki-code-theme-material-dark-font-weight:bold;--shiki-code-theme-min-light:#6F42C1;--shiki-code-theme-min-light-font-weight:bold;--shiki-code-theme-min-dark:#FF7A84;--shiki-code-theme-min-dark-font-weight:bold}html pre.shiki code .sr12r, html code.shiki .sr12r{--shiki-light:#24292E;--shiki-light-font-weight:bold;--shiki-default:#24292E;--shiki-default-font-weight:bold;--shiki-dark:#E1E4E8;--shiki-dark-font-weight:bold;--shiki-code-theme-vitesse-light:#393A34;--shiki-code-theme-vitesse-light-font-weight:bold;--shiki-code-theme-vitesse-dark:#DBD7CAEE;--shiki-code-theme-vitesse-dark-font-weight:bold;--shiki-code-theme-catppuccin-light:#D20F39;--shiki-code-theme-catppuccin-light-font-weight:bold;--shiki-code-theme-catppuccin-dark:#F38BA8;--shiki-code-theme-catppuccin-dark-font-weight:bold;--shiki-code-theme-one-light:#986801;--shiki-code-theme-one-light-font-weight:bold;--shiki-code-theme-one-dark:#D19A66;--shiki-code-theme-one-dark-font-weight:inherit;--shiki-code-theme-material-light:#E53935;--shiki-code-theme-material-light-font-weight:bold;--shiki-code-theme-material-dark:#F07178;--shiki-code-theme-material-dark-font-weight:bold;--shiki-code-theme-min-light:#6F42C1;--shiki-code-theme-min-light-font-weight:bold;--shiki-code-theme-min-dark:#FF7A84;--shiki-code-theme-min-dark-font-weight:bold}html pre.shiki code .s02sO, html code.shiki .s02sO{--shiki-light:#B31D28;--shiki-light-font-style:italic;--shiki-default:#B31D28;--shiki-default-font-style:italic;--shiki-dark:#FDAEB7;--shiki-dark-font-style:italic;--shiki-code-theme-vitesse-light:#999999;--shiki-code-theme-vitesse-light-font-style:italic;--shiki-code-theme-vitesse-dark:#666666;--shiki-code-theme-vitesse-dark-font-style:italic;--shiki-code-theme-catppuccin-light:#4C4F69;--shiki-code-theme-catppuccin-light-font-style:inherit;--shiki-code-theme-catppuccin-dark:#CDD6F4;--shiki-code-theme-catppuccin-dark-font-style:inherit;--shiki-code-theme-one-light:#50A14F;--shiki-code-theme-one-light-font-style:inherit;--shiki-code-theme-one-dark:#FFFFFF;--shiki-code-theme-one-dark-font-style:inherit;--shiki-code-theme-material-light:#39ADB5;--shiki-code-theme-material-light-font-style:inherit;--shiki-code-theme-material-dark:#89DDFF;--shiki-code-theme-material-dark-font-style:inherit;--shiki-code-theme-min-light:#24292EFF;--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 .sORj3, html code.shiki .sORj3{--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:#6182B8;--shiki-code-theme-material-light-font-style:inherit;--shiki-code-theme-material-dark:#82AAFF;--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 .szOsf, html code.shiki .szOsf{--shiki-light:#24292E;--shiki-default:#24292E;--shiki-dark:#E1E4E8;--shiki-code-theme-vitesse-light:#999999;--shiki-code-theme-vitesse-dark:#666666;--shiki-code-theme-catppuccin-light:#04A5E5;--shiki-code-theme-catppuccin-dark:#89DCEB;--shiki-code-theme-one-light:#383A42;--shiki-code-theme-one-dark:#ABB2BF;--shiki-code-theme-material-light:#39ADB5;--shiki-code-theme-material-dark:#89DDFF;--shiki-code-theme-min-light:#24292EFF;--shiki-code-theme-min-dark:#B392F0}html pre.shiki code .s-TM-, html code.shiki .s-TM-{--shiki-light:#E36209;--shiki-light-font-style:inherit;--shiki-default:#E36209;--shiki-default-font-style:inherit;--shiki-dark:#FFAB70;--shiki-dark-font-style:inherit;--shiki-code-theme-vitesse-light:#B07D48;--shiki-code-theme-vitesse-light-font-style:inherit;--shiki-code-theme-vitesse-dark:#BD976A;--shiki-code-theme-vitesse-dark-font-style:inherit;--shiki-code-theme-catppuccin-light:#4C4F69;--shiki-code-theme-catppuccin-light-font-style:italic;--shiki-code-theme-catppuccin-dark:#CDD6F4;--shiki-code-theme-catppuccin-dark-font-style:italic;--shiki-code-theme-one-light:#383A42;--shiki-code-theme-one-light-font-style:inherit;--shiki-code-theme-one-dark:#E06C75;--shiki-code-theme-one-dark-font-style:inherit;--shiki-code-theme-material-light:#E53935;--shiki-code-theme-material-light-font-style:inherit;--shiki-code-theme-material-dark:#F07178;--shiki-code-theme-material-dark-font-style:inherit;--shiki-code-theme-min-light:#24292EFF;--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 .snVmB, html code.shiki .snVmB{--shiki-light:#D73A49;--shiki-default:#D73A49;--shiki-dark:#F97583;--shiki-code-theme-vitesse-light:#AB5959;--shiki-code-theme-vitesse-dark:#CB7676;--shiki-code-theme-catppuccin-light:#179299;--shiki-code-theme-catppuccin-dark:#94E2D5;--shiki-code-theme-one-light:#0184BC;--shiki-code-theme-one-dark:#C678DD;--shiki-code-theme-material-light:#39ADB5;--shiki-code-theme-material-dark:#89DDFF;--shiki-code-theme-min-light:#D32F2F;--shiki-code-theme-min-dark:#F97583}html pre.shiki code .sgh53, html code.shiki .sgh53{--shiki-light:#D73A49;--shiki-default:#D73A49;--shiki-dark:#F97583;--shiki-code-theme-vitesse-light:#999999;--shiki-code-theme-vitesse-dark:#666666;--shiki-code-theme-catppuccin-light:#179299;--shiki-code-theme-catppuccin-dark:#94E2D5;--shiki-code-theme-one-light:#0184BC;--shiki-code-theme-one-dark:#ABB2BF;--shiki-code-theme-material-light:#39ADB5;--shiki-code-theme-material-dark:#89DDFF;--shiki-code-theme-min-light:#D32F2F;--shiki-code-theme-min-dark:#F97583}html pre.shiki code .smpFa, html code.shiki .smpFa{--shiki-light:#005CC5;--shiki-default:#005CC5;--shiki-dark:#79B8FF;--shiki-code-theme-vitesse-light:#2E8F82;--shiki-code-theme-vitesse-dark:#5DA994;--shiki-code-theme-catppuccin-light:#8839EF;--shiki-code-theme-catppuccin-dark:#CBA6F7;--shiki-code-theme-one-light:#383A42;--shiki-code-theme-one-dark:#E5C07B;--shiki-code-theme-material-light:#E2931D;--shiki-code-theme-material-dark:#FFCB6B;--shiki-code-theme-min-light:#1976D2;--shiki-code-theme-min-dark:#79B8FF}html pre.shiki code .sZ-Ck, html code.shiki .sZ-Ck{--shiki-light:#24292E;--shiki-default:#24292E;--shiki-dark:#E1E4E8;--shiki-code-theme-vitesse-light:#999999;--shiki-code-theme-vitesse-dark:#666666;--shiki-code-theme-catppuccin-light:#4C4F69;--shiki-code-theme-catppuccin-dark:#CDD6F4;--shiki-code-theme-one-light:#383A42;--shiki-code-theme-one-dark:#ABB2BF;--shiki-code-theme-material-light:#90A4AE;--shiki-code-theme-material-dark:#BABED8;--shiki-code-theme-min-light:#24292EFF;--shiki-code-theme-min-dark:#B392F0}",{"title":484,"searchDepth":523,"depth":523,"links":1352},[1353,1354,1355,1356,1357,1358,1359],{"id":449,"depth":523,"text":450},{"id":548,"depth":523,"text":548},{"id":631,"depth":523,"text":631},{"id":848,"depth":523,"text":848},{"id":941,"depth":523,"text":941},{"id":1077,"depth":523,"text":1078},{"id":1304,"depth":523,"text":1304},"在 Markdown 中传入 Vue props、插槽和嵌套组件，并了解本站的组件注册方式。","md",{},{"icon":140},"---\ntitle: MDC 语法与组件注册\ndescription: 在 Markdown 中传入 Vue props、插槽和嵌套组件，并了解本站的组件注册方式。\nnavigation:\n  icon: lucide-file-code\n---\n\nMDC 让文章作者在 Markdown 中使用 Vue 组件。本文中的示例都可用于 `content\u002Fdocs\u002F` 和 `content\u002Fblog\u002F`；渲染仍由页面里的 `ContentRenderer` 完成。完整组件索引见 [常用组件](\u002Fdocs\u002F简单文档\u002Fcomponents\u002Fapi)。\n\n## 块组件与 Markdown 正文\n\n`::组件名` 到配对的 `::` 是一个组件块。默认插槽里的段落、列表、链接和代码块继续按 Markdown 渲染。\n\n::article-summary{title=\"本页要点\"}\n- 普通文本、Markdown 和 Vue 组件可以组合。\n- 属性负责数据，插槽负责富文本。\n- 复杂数组推荐写成组件内的 YAML。\n::\n\n```mdc\n::article-summary{title=\"本页要点\"}\n- 普通文本、Markdown 和 Vue 组件可以组合。\n- 属性负责数据，插槽负责富文本。\n::\n```\n\n## 行内组件\n\n单个冒号用于行内组件，例如版本 :badge[Nuxt 4]{color=\"info\"} 和图标 :smart-icon{name=\"lucide-sparkles\" size=18}。\n\n```mdc\n版本 :badge[Nuxt 4]{color=\"info\"}\n图标 :smart-icon{name=\"lucide-sparkles\" size=18}\n```\n\n## 简单属性与结构化属性\n\n字符串写在 `{}` 中。数字、布尔值、数组与对象使用 `:` 绑定：\n\n```mdc\n::expand-box{title=\"默认展开\" :open=\"true\"}\n正文内容。\n::\n\n::stat-grid{:items='[{\"label\":\"组件\",\"value\":20},{\"label\":\"集合\",\"value\":2}]' :columns=\"2\"}\n::\n```\n\n复杂数据用组件内的 `---` YAML 区域，避免长 JSON 和引号转义。这个区域设置该组件的 props，与文件顶部设置文章元信息的 frontmatter 不同。\n\n::stat-grid\n---\ncolumns: 2\nitems:\n  - label: 内容集合\n    value: 2\n    description: 文档与博客\n  - label: 公共自定义组件\n    value: 27\n    description: 包含时间线条目与兼容入口\n---\n::\n\n```mdc\n::stat-grid\n---\ncolumns: 2\nitems:\n  - label: 内容集合\n    value: 2\n    description: 文档与博客\n  - label: 公共自定义组件\n    value: 27\n---\n::\n```\n\n## 命名插槽\n\n组件内部的 `#takeaway` 把后面的 Markdown 交给同名插槽。这里的 `#` 是插槽标记，不是文章标题。\n\n::article-summary{title=\"排版建议\"}\n默认插槽适合写**背景与重点**。\n\n#takeaway\n结论：把一句行动建议放进 `takeaway` 插槽。\n::\n\n```mdc\n::article-summary{title=\"排版建议\"}\n默认插槽适合写**背景与重点**。\n\n#takeaway\n结论：把一句行动建议放进 takeaway 插槽。\n::\n```\n\n## 嵌套组件\n\n外层使用更多冒号，可清楚区分结束位置。每个组件的开始和结束冒号数保持一致。\n\n:::doc-timeline{label=\"写作流程\"}\n::timeline-item{title=\"准备内容\" date=\"第一步\"}\n确定文章读者与结论。\n::\n::timeline-item{title=\"补充示例\" date=\"第二步\"}\n加入代码、图表和可操作的清单。\n::\n:::\n\n````mdc\n:::doc-timeline{label=\"写作流程\"}\n::timeline-item{title=\"准备内容\" date=\"第一步\"}\n确定文章读者与结论。\n::\n::timeline-item{title=\"补充示例\" date=\"第二步\"}\n加入代码、图表和可操作的清单。\n::\n:::\n````\n\n## Vue 实现与注册\n\n本站组件位于 `app\u002Fcomponents\u002Fcontent\u002F`。例子：\n\n```vue [app\u002Fcomponents\u002Fcontent\u002FArticleSummary.vue]\n\u003Ctemplate>\n  \u003Caside>\n    \u003Cp>{{ title }}\u003C\u002Fp>\n    \u003Cslot \u002F>\n    \u003Cslot name=\"takeaway\" \u002F>\n  \u003C\u002Faside>\n\u003C\u002Ftemplate>\n\n\u003Cscript setup lang=\"ts\">\ndefineProps\u003C{ title?: string }>()\n\u003C\u002Fscript>\n```\n\nNuxt Content 会扫描内容组件目录。本站还通过 `app\u002Fplugins\u002Fcontent-components.ts` 显式注册公共名称，`shared\u002Fmdc-components.ts` 保持 Studio 组件选择器一致；教学示例目录使用按需异步注册。Nuxt UI 的 `::tabs`、`::callout` 等由模块配置映射到 `Prose*`。\n\n新增公共组件时同步三个位置：Vue 文件、注册插件、Studio 名称清单，然后补充实例文档。组件放到其他目录时，需要全局注册或通过 `ContentRenderer` 的 `components` 映射提供，不能仅依赖普通模板的自动导入。\n\n在 `\u003Cspan>` 或标题里放插槽，可用 `\u003Cslot mdc-unwrap=\"p\" \u002F>` 去掉默认段落包装。需要段落、列表和代码的正文容器应保留完整 `\u003Cslot \u002F>`。\n\n## 编写约定\n\n- 组件属性使用明确类型；组件中不访问服务端不存在的 `window`、`document`。\n- 路由链接使用安全 URL 校验；新窗口链接保留 `noopener noreferrer`。\n- 表单控件要有可见标签，折叠和图片预览必须能用键盘操作。\n- 检查清单仅在当前页面保存状态；刷新后恢复 Markdown 的初始数据。\n- Markdown\u002FMDC 作者属于受信任的内容贡献者，组件功能不能代替内容访问控制。\n\n相关语法以 [Nuxt Content Markdown 文档](https:\u002F\u002Fcontent.nuxt.com\u002Fdocs\u002Ffiles\u002Fmarkdown) 与 [ContentRenderer API](https:\u002F\u002Fcontent.nuxt.com\u002Fdocs\u002Fcomponents\u002Fcontent-renderer) 为准。\n",{"title":137,"description":1360},"j0CBj-7hBSSh8OKzC27ze_eoewKBPJHXwRqHZ4FYCcA",[1368,1370],{"title":132,"path":133,"stem":134,"description":1369,"icon":135,"children":-1},"实际体验搜索排序分页、API 参数、图片对比、术语 popover、自测和文件下载。",{"title":142,"path":143,"stem":144,"description":1371,"icon":145,"children":-1},"用一个文档页面实际体验摘要、折叠、引用、指标、时间线、检查清单及图片预览。",1791307029867]