Vue:生命周期

2017-10-15  本文已影响0人  蚊小文

每个 Vue 实例在被创建之前都要经过一系列的初始化过程。例如需要设置数据监听、编译模板、挂载实例到 DOM、在数据变化时更新 DOM 等。同时在这个过程中也会运行一些叫做生命周期钩子的函数,给予用户机会在一些特定的场景下添加他们自己的代码。

生命周期图示

vue生命周期.png

钩子函数

var vm=new Vue({
    data:{
        msg:'ymy'
    },
    methods:{
        update(){
            this.msg="哈哈哈哈哈"
            alert('修改了')
        }
    },
    beforeCreate(){
        alert('创建前')
    },
    created(){
        alert('创建后')
    },
    beforeMount(){
        alert('挂载前')
    },
    mounted(){
        alert('挂载后')
    },
    beforeUpdate(){
        alert('更新前')
    },
    updated(){
        alert('更新后')
    },
    beforeDestroy(){
        alert('销毁前')
    },
    destroy(){
        alert('销毁后')
    }
});
vm.$mount('#app');
//vm.$destroy();//强制手动销毁
上一篇下一篇

猜你喜欢

热点阅读