components 注册子组件

最后更新：2026-10-22

components 选项在局部注册子组件：只在该组件内可用，避免全局污染（优于全局注册）。

📝 语法

export default {
  components: { TodoItem }
}

value	对象：注册名（可用 kebab-case）→ 组件定义

返回值：无返回值

修改下面的代码，在预览区实时查看效果：

输出：

渲染两个待办项。

💡 提示 优先局部注册：依赖关系清晰，打包工具也能做 tree-shaking。

ℹ️ 说明 组件名用 kebab-case 才能在 DOM 模板（非 SFC）里正确匹配。

⚠️ 注意 全局注册（app.component）会让组件进入所有模板：少量基础组件才这么做。

更多案例即将上线。

Q 和全局注册的区别？

A 局部注册只在当前组件可用且可打包剔除；全局处处可用但无法 tree-shake。

Q 注册名必须 kebab-case 吗？

A DOM 模板里必须；SFC 模板两种都能识别。

Q 能动态注册吗？

A 可以但少见：通常用 <component :is> 做动态切换。

Web-Tutorial 技术团队

由多位开发者共同维护的编程教程平台。每篇教程由对应领域的开发者编写和审核，确保内容准确可靠。如发现任何问题，欢迎向我们反馈。