vue生命周期简述

beforecreate

• initLifecycle(vm)、initEvents(vm)、initRender(vm)已经执行完毕
• 调用此函时，仅仅表示Vue实例刚刚被创建出来
• 此时还没有初始化Vue实例中的数据和方法，所以还不能访问Vue实例中保存到数据和方法

created

• initInjections(vm)、initState(vm)、initProvide(vm)已经执行完毕
• 调用次函数时，是我们最早能够访问到Vue实例中保存的数据和方法的地方,此时还没有进行模板编译

created——boforemount

• 开始编译模板，根据data中的数据和指令生成HTML，注意此时没有渲染到界面上，仅存在内存中

boforemount

• 调用此函数时，Vue的编译模板已经准备好了，但是还没有将最终的模板渲染到界面上

boforemount——mounted

• 用编译好的模板替换el属性指向的DOM对象的内容

mounted

• 调用此函数时，表示Vue已经完成了模板的渲染，表示我们已经可以拿到界面上渲染之后的内容了

boforeupdate

• 调用此函数之前，已完成对数据的监听，一旦数据发生变化
• 就调用此函数，注意，只有保存的数据被修改了才会调用beforeupdate，否则不会调用。
• 特点：数据已经被修改了，但是界面还没有更新渲染（数据改了，界面显示旧数据）

boforeupdate——updated

• 根据新的数据生成虚拟DOM，再用虚拟DOM更新真实的DOM（patch）
• 重新渲染真实DOM
• 界面数据逐渐变成新的

updated

• 调用此函数时，表示Vue实例中保存的数据被修改了，并且界面也同步修改了，也就是说
• 数据和界面已经同步更新

beforedestory

• 调用此函数时，表示当前组价即将被销毁了
• 注意：只要组件不被销毁，那么beforedestory就不会被调用
• beforedestory也是最后可以访问到组件数据和方法的函数

destoryed

• 调用此函数时，组件已经被销毁了
• 不能在此函数中对组件进行数据访问