声明周期事件详细

---

声明周期函数-生命周期钩子函数-生命周期事件

每个 Vue 组件实例在创建时都需要经历一系列的初始化步骤，比如设置好数据侦听，编译模板，挂载实例到 DOM，以及在数据改变时更新 DOM。在此过程中，它也会运行被称为生命周期钩子的函数，让开发者有机会在特定阶段运行自己的代码。

---

在引入Vue.js插件下运行

一、生命周期函数

示例：pandas 是基于NumPy 的一种工具，该工具是为了解决数据分析任务而创建的。

生命周期
初始化尚未完成，data数据，metheds方法都未挂在在vue实例上
一般用于页面重定向

beforeCreate(){
            console.log(111);
            console.log(this.msg);
        },

也买你初始化完成
第一个能data数据的生命周期，一般用于接口请求+数据初始化
DOM数据已经渲染完了，开始请求

created() {
                console.log(456);
            }

DOM挂载前
虚拟DOM元素挂载后，如果需要操作DOM,可以再次生命周期执行
beforeMount调用后，我们要开始渲染render函数了，首先我们会先生产一个虚拟dom，进行保存，然后再开始将render渲染成为真实的dom。渲染成真实dom后，会将渲染出来的真实dom替换掉原来的vm.$el，然后再将替换后的$el append到我们的页面内。

beforeMount() {
                console.log(this.$el);
            },

DOM挂载完成
再调用mounted，并将标识生命周期的一个属性_isMounted 置为true。所以mounted函数内，我们是可以操作dom的，因为这个时候dom已经渲染完成了。

mounted() {
                console.log(this.$el);
            }

页面更新前 可以执行0-多次
updated里面也可以操作dom，并拿到最新更新后的dom。不过这里我要插一句话了，mouted和updated的执行，并不会等待所有子组件都被挂载完成后再执行，所以如果你希望所有视图都更新完毕后再做些什么事情，那么你最好在mouted或者updated中加一个$nextTick（），然后把要做的事情放在$netTick()中去做

beforeUpdate() {
                console.log(this.$el);
            }

页面更新后

updated(){
                console.log(this.$el);
            }

转载文章

---

总结

提示：这里对文章进行总结：

一些细节都在代码片中，注意看