vue生命周期

什么是生命周期

从Vue实例创建、运行、到销毁期间，总是伴随着各种各样的事件，这些事件，统称为生命周期！

vue生命周期钩子函数

每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如，需要设置数据监听、编译模板、将实例挂载到 DOM 并在数据变化时更新 DOM 等。同时在这个过程中也会运行一些叫做生命周期钩子的函数，这给了用户在不同阶段添加自己的代码的机会。

生命周期函数=生命周期事件=生命周期钩子

vue生命周期

  // 初始化还未完成 
  data中的数据和methods的方法还没有挂载到vue实例上 
            // 一般用于页面的重定向
            beforeCreate() {
                console.log(1);
                console.log(this.msg);
            },
            // 数据初始化已经完成，它是第一个可以操作data中
            数据和methods中的方法的生命周期
            // 接口请求 和 数据初始化
            created() {
                console.log(2);
                console.log(this.msg);
            },
            // 虚拟DOM挂载之前  页面元素还没有更新
            beforeMount() {
                console.log(3);
                // debugger
            },
            // 初始化已完成   它是第一个可以操作DOM元素的生命周期
            mounted() {
                console.log(4);
            },
            // 执行0次或者多次
            // 页面中数据不是最新的，data里面是最新的
            beforeUpdate() {
                console.log(5);
            },
            // 页面已经更新，是最新的数据
            updated() {
                console.log(6);
            },
            beforeDestroy() {
                console.log(7);
            },
            destroyed() {
                console.log(8);
            }
        })