动态组件

<component v-bind:is="组件的名字"></component>

可以用keep-alive组件实例能够被在它们第一次被创建的时候缓存下来

<keep-alive>
  <component v-bind:is="组件的名字"></component>
</keep-alive>

activated(){}组件激活时调用

deactivated(){}组件停用时调用

一个简单demo

<body>
<div id="root">
    <input type="button" @click="index++;if(index>3){index=0;}" value="切换">
    <components :is="comArr[index]"></components>
</div>
</body>
<script>
    new Vue({
        el:"#root",
        data:{
            index:0,
            comArr:["one","two","three","four"]
        },
        components:{
            one:{
                template:`<div style="background:red">one</div>`
            },
            two:{
                template:`<div style="background:yellow">two</div>`
            },
            three:{
                template:`<div style="background:green">three</div>`
            },
            four:{
                template:`<div style="background:blue">four</div>`
            }
        }
    })
</script>