一、概念

       Vue的动态组件<component>是一个强大的模块，通过动态组件可以让页面组件随意切换，动态地挂zai不同的组件，不需要通过路由定位。

二、使用说明

1、<component>标签本身不代表任何具体的组件，而是作为一个占位符存在，在使用过程和普通自定义的组件基本一致。

2、is属性：用来指定<component>标签应该渲染哪个组件。is的值通常是一个字符串，表示要加zai的组件名称，或者是一个返回组件选项的计算属性。

<component :is="需切换的组件名"></component>

3、<keep-alive>标签：当在这些组件之间切换的时候，想保持这些组件的状态，避mian反复重新渲染，我们可以使用<keep-alive>标签包裹动态组件，这样能够使被替换的组件不用经历组件的再生成过程（被替换的组件将处于缓存状态）

• include 属性：可以通过向该属性提交组件名来指定需要被缓存的组件。如果有多个组件需要被缓存，使用逗号分隔组件名。
• exclude 属性：可以通过向该属性提交组件名来指定不需要被缓存的组件。如果有多个组件不需要被缓存，使用逗号分隔组件名。

<!-- 注意：include、exclude绑定的组件名是对应组件内的name值-->
<keep-alive include="page1,page3">
    <component :is="page"></component>
</keep-alive>

4、生命周期函数

• 当组件被激活时将触发 activated 生命周期钩子
• 当组件被缓存时将触发 deactivated 生命周期钩子