vue2 动态组件
2021-03-22 11:16:56
605次阅读
0个评论
<body>
<div id="app">
<div v-for="item in array" :key="item.id">
<component v-if="item.component" :is="item.component"></component>
<span v-else>{{ item.content }}</span>
</div>
</div>
<script>
Vue.component("tab-home", {
template: "<div>Home component</div>"
});
Vue.component("tab-posts", {
template: "<div>Posts component</div>"
});
new Vue({
el: "#app",
data() {
return {
array: [
{ id: 1, content: "test" },
{ id: 2, component: "tab-home" },
{ id: 3, component: "tab-posts" }
]
};
}
});
</script>
</body>00