vue初识之生命周期

一、beforeCreat()

            // 初始化之前,data中的数据和methods中的方法不能拿到,还没初始化
            // 页面的重定向
            beforeCreate() {
                console.log(this);
                console.log(this.msg);
                console.log('beforeCreate');
            },

二、created()

// 初始化完成，data和methods已经初始化完成，第一个可以调用data和methods的生命周期
            // 数据请求，数据初始化
            created() {
                this.msg = 20
                console.log(this.msg);
                console.log('created');
            },

三、beforeMount()

 // 虚拟的DOM挂载，页面中的数据还没有挂载
            beforeMount() {
                console.log('beforeMounte');
                // debugger
            },

四、mounted（）

// 真实的DOM，第一个可以操作DOM元素的生命周期
            mounted() {
                console.log('mounted');
            },

五、beforeUpdate（）

// 可以执行0次或者更多次
            // 更新之前，data中的数据是最新的，页面中的数据还是旧的，还没有同步
            beforeUpdate() {
                console.log('beforeUpdate');

            },

六、Update （）

// 更新之后，data中和页面中的数据都是最新的
            updated() {
                console.log('updated');

            },

七、beforeDestroy()

// 销毁之前
            // 清空定时器 页面监听
            beforeDestroy() {
                console.log('beforeDestory');
            },

八、destroyed()

 // 销毁之后
            destroyed() {
                console.log('destroyed');
            },