vue组件中的生命周期函数

       beforeCreate(){
            console.log('实例刚刚被创建');
        },
        created(){
            console.log('实例创建完成');
        },
        beforeMount(){
            console.log('模板编译之前');
        },
        mounted(){     /*请求数据，操作dom , 放在这个里面  mounted*/
            console.log('模板编译完成');
        },
        beforeUpdate(){
            console.log('数据更新之前');
        },
        updated(){
            console.log('数据更新完毕');
        },
        beforeDestroy(){   /*页面销毁的时候要保存一些数据，就可以监听这个销毁的生命周期函数*/
            console.log('实例销毁之前');
        },
        destroyed(){
            console.log('实例销毁完成');

通过v-if条件判断指令完成组件的挂载与卸载

 <v-life v-if="flag"></v-life>

             <br>
              <br>
               <br>

 <button @click="flag=!flag">挂载以及卸载life组件</button>