Vue生命周期

Vue生命周期,第1张

前言

复习一下vue的生命周期,做个简单记录。

一、8个生命周期函数

newVue()->
beforCreate->created->beforMount->mounted->beforUpdate->updated->beforDestroy->destroyde

newVue() 创建组件实例对象
beforCreate: 初始化事件和生命周期函数,组件的data/props/methods没创建,都处于不可用的状态
created:初始化data/props/methods,创建完成,可以使用。Ajax请求的最早时机。
查找有没有el和template,有的话继续。
beforeMount:基于数据和模板在内存中编译生成HTML结构,浏览器中还没有DOM元素。
Mounted:将内存中编译生成的HTML渲染到浏览器(替换el指定的DOM元素),此时浏览器已经包含当前组件的 DOM结构。现在可以 *** 作DOM元素。
beforUpdate:将要把变动的最新数据重新渲染组件DOM结构。
updated:完成了数据渲染,DOM结构重新渲染。
beforeDestroy:将要销毁该组件,还未销毁,组件还在正常工作。
destroyed:组件销毁,此组件在浏览器中的DOM结构完全移除。
附个链接:
https://cn.vuejs.org/v2/guide/instance.html#%E7%94%9F%E5%91%BD%E5%91%A8%E6%9C%9F%E5%9B%BE%E7%A4%BA

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1296171.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-06-10
下一篇 2022-06-10

发表评论

登录后才能评论

评论列表(0条)

保存