(一)什么是动态组件
让多个组件使用同一个挂载点,并动态切换,这就是动态组件
componentName 是要展示的组件名
<component :is="componentName"></component>
(二)动态组件例子
1. 比如页面配置 给定组件渲染顺序
<template>
<div>
<div v-for="(item, index) in list" :key="index">
<component :is="item"></component>
</div>
</div>
</template>
<script>
// 先把组件引入
import ImageComponent from './Image.vue'
import TextComponent from './Text.vue'
import VideoComponent from './Video.vue'
export default {
components: {
ImageComponent,
TextComponent,
VideoComponent
},
data () {
return {
list: ['ImageComponent', 'TextComponent', 'VideoComponent']
}
},
methods: {
add () {
}
}
}
</script>
<style scoped>
</style>