Vue动态组件

动态组件

component

组件占位符:is表示要渲染组件的名字

<component :is=""></component>

动态组件被切换的时候会被销毁，切换回去的时候会重新创建，为了保持组件的状态，使用

keep-alive

可以把内部组件进行缓存，而不是销毁

<keep-alive>
	<component :is=""></component>	
</keep-alive>

当使用keep-alive时，组件被缓存时，会触发组件的deactivated生命周期；当组件被激活时，会触发组件的activated生命周期；当然，组件第一次被创建时created和deactivated都会被创建

通过keep-alive的include属性，能够指定哪些组件会被缓存或者使用exclude指定哪些不被缓存（二者不可同时使用）

<keep-alive include="组件名">
	<component :is=""></component>	
</keep-alive>

v-once

如果每次组件的内容都一样的话，可以使用v-once指令缓存组件

它和keep-alive的区别是，keep-alive会额外新增生命周期函数

当组件提供了name属性之后，组件的名称就是name属性的值