1、vue2.0的生命周期

发布时间 2023-10-23 21:05:54作者: Hero^

首先,组建从创建到销毁的过程就是它的生命周期。

一共分为4个阶段,创建、挂载、更新以及销毁。

第一个阶段:创建

beforeCreate () {}         // 实例创建前,在这个函数内属性和方法都不能使用  
created () {} // 实例已经初始化好了,也完成了数据挂载,可以修改数据、使用数据但是不能触发updated()函数,不能更新视图

第二个阶段:挂载

beforeMount () {}         // 模版已经编译完成,虚拟DOM也创建完成了,可以使用数据、修改数据,但是不能出发updated()函数,不能更新视图
mounted () {} // 把编译好的模版挂载到页面上,可以在这个函数内调用一步请求,也可以访问DOM节点

第三个阶段:更新

beforeUpdate () {}        // 组件数据更新之前使用,数据是新的,页面上的数据是旧的,组件即将更新,准备渲染,可以修改数据
updated () {} // render()函数重新做了渲染,数据和页面上的数据都是新的,不建议在这个修改数据,可能回造成页面死循环

第四个阶段:销毁

beforeDestory () {}      // 组件销毁之前,这时候组件还没有被销毁,可以在这个函数内清除计时器、清除闭包、移除时间监听
destoryed () {} // 组件销毁后,数据卸载,事件移除、子组件也被销毁了

如果使用了<keep-alive></keep-alive>组件会增加生命周期