
生命周期就是事物产生到消亡的整个过程。比如我们的人生中有很多关键节点,比如出生,成年,结婚,去世等等。每个关键节点前和节点后都会有明显的变化。

Vue3的生命周期
vue官网:
Vue生命周期的关键节点:有4关键节点分别是 create(创建)、 mount(挂载)、update(更新)、 unmount(卸载)。
在每个关键节点前后设置了相应的钩子函数,那么到这个节点前或节点后就会调用相应的钩子函数。所以一共就可以设置8个钩子函数。

挂载(初始化相关属性)
beforeCreate —- 出生前
注意点:在此时不能获取data中的数据,也就是说 this.info 得到的是null
created —- 出生了 (这里就可以获取data中的数据)
beforeMount —- 登记前
mounted —- 登记后【页面加载完毕的时候就是此时】
注意点:默认情况下,在组件的生命周期中只会触发一次
更新(元素或组件的变更操作)beforeUpdate —- 学习前
updated —- 学习会了
注意点:可以重复触发的
销毁(销毁相关属性)
beforeunMount —- 交代后事unmounted —- 寿终正寝

Vue2生命周期与Vue3的区别
vue2与vue3的区别是vue3的卸载变为销毁

unmount -> destroybefore
Unmount -> beforeDestroy // 销毁前unmounted -> destroyed // 已销毁
本人前端菜鸟会持续分析一些前端知识,这次比较简单,是最基础的东西,vue目前是前端主要框架,还有react框架[滑稽]
© 版权声明
本站资源都来源网络搜集发布。
若有侵权或者违规内容,请联系站长删除。
资源仅供本地交流学习,请勿商用,如违反,和本资源网无关,使用者承担一切责任
若有侵权或者违规内容,请联系站长删除。
资源仅供本地交流学习,请勿商用,如违反,和本资源网无关,使用者承担一切责任
THE END
请登录后发表评论
注册