我有一个结构如下的应用程序。
-App.vue
-components
-TodoList.vue
-TodoItem.vue
当我试图从TodoList中使用TodoItem时,我从TodoItem中导入了它。但问题是我需要使用标签</TodoItem>
而不是</todo-item>
来渲染它。
我不太明白,因为我已经将名称导出为'todo-item'。我试图通过遵循Youtube教程重新创建待办事项列表。当我一步一步地遵循教程时,它起作用了。但当我尝试自己重新创建时,它没有。
这是父组件(todo-list),当我遵循教程时,它在组件下没有名称对。
export default {
name: 'todo-list',
components: {
TodoItem,
},
但是我需要在父组件中明确地命名我的组件,但是我自己尝试。
export default {
name: 'todo-list',
components: {
'todo-item': TodoItem,
},
}
在第一种情况下,我成功地使用了</todo-item>
,但第二种情况没有返回任何内容。
任何帮助或解释将非常感谢。
先谢谢你了。
1条答案
按热度按时间ma8fv8wu1#
如果你用小写/ kebab-cased的名字来命名你的组件,它们只能在你的模板中使用。使用Pascal-cased的名字可以让你同时使用它们。
参见https://v2.vuejs.org/v2/guide/components-registration.html#Name-Casing
记住这一点并遵循Vue style guide recommendations,您应该始终使用Pascal大小写的名称
这只是ES6对
并允许您在模板中使用
<TodoItem>
或<todo-item>
。