vue生命周期

一、组件生命周期

组件生命周期：一个组件或一个"页面"加载过程中所经历的每个阶段。

今后只要希望在页面或组件加载完成后自动执行一些初始化任务时就需要用到组件页面的生命周期.

四个阶段

(仅以new Vue()举例)

(1)创建(create)阶段(必经).

a．创建new Vue()对象.

b．加载data对象到new Vue()中。

c．暂时没有虚拟DOM树，可能无法执行DOM操作

(2)挂载(mount)阶段

a.根据el所指扫描页面，并首次将data中的变量值渲染到页面显示.

b.既有data，又有虚拟DOM树，既可以操作data中的变量，又可以对页面执行DOM操作.

(3)更新(update)阶段(只有在data中的变量被修改后才自动触发)

(4)销毁(destroy)阶段 (只有手动调用$destroy()函数，销毁当前组件时才自动触发)

生命周期钩子函数

在每个生命周期阶段自动触发的特定的回调函数(类似于Dom 中的事件处理函数)

只要希望在特定的生命周期阶段执行一些操作时，都要把操作写在对应的生命周期钩子函数内，才能自动触发.

过程：

beforecreate()

创建(create)

created()

//可发送axios请求，此时也有data，如果请求回来数据，返回到data中，自动更新到页面上

风险：万一axios回来快，后续mount阶段还没完成，无法进行DOM操作

beforemount()

挂载(mount)

mounted()

//最稳妥的发送axios请求时机：既有data又可以进行DOM操作

beforeupdate()

更新(update)

updated()

beforedestroy()

销毁(destroy)

destroyed