vue使用component通过:is多组件引入

在某一个页面有多个组件需要同时引入或者按需引入，并且通过后端接口控制显示哪些组件。

<div>
	<component v-for="(item,index) in compList" :is="item.path" :key="index" ></component>
</div>
<scipt>
//在component.js我们可以先注册需要的组件进去,或者在mian.js里面统一注入
import componentList form '../componentList .js'
Vue.use(componentList )

export default{
	compList:[],//这个文件可以是后端传入
	//默认赋值的话可以
	created(){
		this.compList=[
			{id:'1',path:'component1',name:'组件1',ishow:true},
			{id:'2',path:'component2',name:'组件2',ishow:false}
			{id:'3',path:'component3',name:'组件3',ishow:true}
		]
	}
}

</scipt>




在componentList.js文件中注入组件
//componentList.js
import component1 form '../component1.vue'
import component2 form '../component2.vue'
import component3 form '../component3.vue'
export default{
	install(Vue){
		Vue.component('component1 ',component1);
		Vue.component('component2 ',component2);
		Vue.component('component3 ',component3);
	}
}