Vue生命周期的执行过程（极简版）

Vue生命周期的执行过程（极简版）

1.创建vue实例
2.在创建实例的时候,执行了init(一奶他),init初始化的时候调用了beforeCreate钩子函数
3.同时监听了data的数据,初始化了vue内部事件,进行属性和方法的计算
4.然后调用Create钩子函数,axios大多会在这个周期里执行
5.模板编译,把data里的数据和vue语法编译成HTML,编译的过程中如果实例内部有template属性，直接调用，然后调用render函数去渲染,如果没有template属性调用外部HTML,如果都没有抛出错误
6.编译模板完成后，调用beforeMount钩子函数
7.render函数执行完成之后，将渲染出来的内容挂载到DOM节点上
8.挂载结束，调用Mounted钩子函数；
9.数据发生变化，调用beforeUpdate钩子函数，期间经历虚拟dom；
10.更新完成，调用Updated钩子函数；
11.beforeDestory销毁所有观察者、组件及事件监听；
12.Destoryed实例销毁；

Vue生命周期的执行过程（段落版）

首先创建vue实例,在创建实例的过程中初始化了init()并调用了beforeCreate钩子函数,监听了data,执行了vue的初始化,然后调用了Create钩子函数,一般axios都是在这个时候执行的,创建完了以后进行模板编译,简单来说就是把vue的语法HTML化,使浏览器可以读取,编译的过程中如果实例中有template属性直接调用render函数去渲染,如果没有就去调用外部html,如果都没有的话就抛出错误,模板编译完成后就去调用beforeMount钩子函数,render函数执行完成以后就将渲染的内容挂载到DOM上,挂载结束以后就去调用Mounted钩子函数,然后在数据发生改变时调用beforeupdata钩子函数,更新完成后调用updated钩子函数,beforeDestory销毁所有观察者以及组件及监听事件,Destoryed实例销毁