Vue之生命周期

本文详细解析Vue.js中的生命周期,包括从组件创建、挂载到销毁的各个阶段,以及每个阶段对应的钩子函数。了解这些可以帮助开发者更好地掌握Vue组件的运行机制。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

Vue里的概念—生命周期,是指一个vue组件从开始到消亡经历的各种状态,具体点来说就是组件从创建,到组件挂载到页面上运行,再到页面关闭组件被卸载经历的各种状态。
在每个阶段,vue会自动调用相应的生命周期的钩子函数,所以当我们在某个钩子函数中挂载我们的自定义函数时,就会在相应的生命周期自动调用

beforeCreate()

vue实例还没初始化,vue实例挂载的元素和data数据都还没初始化
数据监测和事件都还没被调用,这时还不能获取data里的数据,method里的方法

Created()

Created() 是常用的钩子函数,data已经被初始化
这时data和methos都可以被获取到;一般在这里可以进行ajax请求

beforeMouted()

在实例被挂载之前, $el也被初始化了,但是还只是虚拟的dom节点,还未真正挂载

Mouted()

这时候vue实例已经挂载到页面上了 ,可以获取到el里的元素,可以进行dom操作了

beforeUpdate()

更新前调用,这时获取到的数据是更新后的,但是dom节点是更新前的,
因此如果在这里是可以继续改变数据状态,但是视图是不会对应渲染更新

Update()

更新时调用
这个时候视图就是可以渲染更新的了

beforeDestroy()

销毁组件前调用,这时实例还是可以使用的
可以在这个时候清除一些任务,比如清除定时器

Destroy()

vue实例被销毁
它上面原来绑定的数据和事件都会解绑,子实例也会被销毁。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值