После определения некоторых компонентов и использования внутри страницы, например:
<html>
...
<body>
...
<div class = "card border-left-3 border-left-grey-400 rounded-left-0">
<ul id = "tab-list" class = "nav nav-tabs nav-tabs-bottom mb-0">
<li class = "nav-item">
<a href = "#card-toolbar-tab1" class = "nav-link active legitRipple" data-toggle = "tab">
tree list view
</a>
</li>
<li class = "nav-item">
<a href = "#card-toolbar-tab2" class = "nav-link legitRipple" data-toggle = "tab">
list view
</a>
</li>
</ul>
<div id = "tab-content" class = "card-body tab-content pr-0 pl-0">
<div id = "card-toolbar-tab1" class = "tab-pane fade active show">
<categories-tree-view inline-template>
<div></div>
</categories-tree-view>
</div>
<div id = "card-toolbar-tab2" class = "tab-pane fade pl-3 pr-3">
<categories-list-view inline-template>
<div></div>
</categories-list-view>
</div>
</div>
</div>
...
</body>
...
</html>
оба определенных компонента, такие как categories-tree-view
и categories-list-view
, работают без каких-либо проблем, теперь я хочу обернуть их другим компонентом, таким как categories
, например:
...
<categories inline-template>
<div class = "card border-left-3 border-left-grey-400 rounded-left-0">
<ul id = "tab-list" class = "nav nav-tabs nav-tabs-bottom mb-0">
<li class = "nav-item">
<a href = "#card-toolbar-tab1" class = "nav-link active legitRipple" data-toggle = "tab">
tree list view
</a>
</li>
<li class = "nav-item">
<a href = "#card-toolbar-tab2" class = "nav-link legitRipple" data-toggle = "tab">
list view
</a>
</li>
</ul>
<div id = "tab-content" class = "card-body tab-content pr-0 pl-0">
<div id = "card-toolbar-tab1" class = "tab-pane fade active show">
<categories-tree-view inline-template>
<div></div>
</categories-tree-view>
</div>
<div id = "card-toolbar-tab2" class = "tab-pane fade pl-3 pr-3">
<categories-list-view inline-template>
<div></div>
</categories-list-view>
</div>
</div>
</div>
</categories>
вот я получаю эту ошибку:
[Vue warn]: Unknown custom element: <categories-tree-view>
- did you register the component correctly? For recursive components,
make sure to provide the "name" option.
found in
---> <Categories>
<Root> app.js:833:15
[Vue warn]: Unknown custom element: <categories-list-view>
- did you register the component correctly? For recursive components,
make sure to provide the "name" option.
Реализация vuejs
для определения этих компонентов:
new Vue({
store,
components:
{
//category
'categories':()=>import('@Component/pages/category/categories.js'),
'categories-tree-view':()=>import('@Component/pages/category/categories-list-view.js'),
'categories-list-view':()=>import('@Component/pages/category/categories-tree-view.js'),
'category_item':()=>import('@Component/pages/category/category-item.js'),
}
}
}).$mount('#app');
вам нужно импортировать их в компонент категорий или использовать слот