VUE的生命周期

1.beforeCreate创建之前

• 初始化过程，使用者是无法参与的。如果vue代码中有预留beforeCreate函数，那么就会执行这个函数；如果没有预留，那么就会继续往下走。
  
• 上图中绿色框框是使用者无法参与的，控制不了的。
• 因此在beforeCreate中，使用者是不会去做任何事，因为在这里，想访问初始化状态，任何东西都访问不到。

var vm = new Vue({
            el:"#box",
            data:{
                myname:"aaa"
            },
            beforeCreate(){
                console.log("beforeCreate",this.myname)
            },

因此，beforeCreate是一个不常用的生命周期函数。

2.created创建完成

在created函数中，是可以访问到状态的，在这一步骤是可以初始化状态或者挂载到当前实例的一些属性。

<div id="box">
        {{myname}}
        {{globalName}}
    </div>
    <!-- 根组件 -->
    <script>
       var vm = new Vue({
            el:"#box",
            data:{
                myname:"aaa"
            },
            created(){
                console.log("created","初始化状态或者挂载到当前实例的一些属性")
                this.myname = this.myname + "11111"
                this.globalName = "this可以直接访问的属性值:"
            }
        })
    </script>

在浏览器中就可以直接访问到属性值。如果有需要就可以直接挂载到this实例中使用。

但是！

当运行到created函数时，data中的状态才会被拦截到，而不放在data中的是拦截不到的

作用：当需要一打开组件，需要从localStorage中取一个值，但是这个值也不是一个状态，此时可以挂载在this可以随时访问的一个全局的实例的一个属性

3.beforeMount挂载之前

可以访问到dom层内容，可以在模板解析之前最后一次修改模板节点。
因为dom层可以直接修改，所以beforeMount也是一个不常用的生命周期函数。

4.mounted挂载完成

            beforeMount(){
                console.log("beforeMount",document.getElementById("box").innerHTML)
            },
            mounted(){
                console.log("Mounted","真实dom节点",document.getElementById("box").innerHTML)
            }

在这一节点Mounted能够拿到真实的dom。

1. 有些库，类似于swiper轮播图，依赖于dom创建之后，才进行初始化工作的插件；
2. 还可以订阅bus.$on
3. 发Ajax
   注意：在发送Ajax时，created和mounted都可以发送，created会更早一点点，二者区别不大，唯一区别就是在后端渲染组件的时候，mounted是在页面的时候触发，而created是在后端渲染的时候也会触发。

5.beforeUpdate更新之前

用于记录老的dom某些状态，例如滚动条位置记录等

6.updated更新完成

这一步是更新完成之后，可以获取更新后的dom。只有在updated中我们才可以确定成功上树到dom中，这时候才可以对一些新的dom做一些相关的处理工作。

当在Ajax发送取完数据之后，而不能够访问到最新的dom结构，因为在这会进行虚拟dom创建，diff对比，状态立即更新，dom异步更新。

7.beforeDestroy销毁之前（vue3变成beforeUnmount)

一般需要在定时器或者事件解绑上需要用到生命周期的销毁函数，它可以在倒计时结束之后，销毁掉此组件。

8.destroyed销毁完成（vue3变成unmounted)

总结：前四个生命周期函数只会运行一次，而beforeUpdate和updated会运行多次，只要有任何状态更新就会运行，而beforeDestroy和destroy也只会执行一次。

在这八个生命周期函数中，一般常用的也就created、mounted、beforeUpdate、updated和beforeDestroy

上述是个人所学到的知识点，如果大家有不同意见的，请赐教！