Vue生命周期简要学习

近几天本想投Java的面试,无奈之前学的框架都忘光光了,随便投了几份前端vue的,之前只是使用过vue,任务也比较重,没有来得及认真总结,只是学了些皮毛。之前感觉写博客浪费太多时间也好,懒得总结也好,无论如何还是要记录一些,有的部分可能会采用手写的方式,仅作自学记录。而且因为我学过的内容大多都是杂而不精,会比较着其他语言或框架的特性来理解一些新的内容,还望不喜勿喷。

什么是Vue生命周期

首先来看一下什么是Vue生命周期:一个Vue实例从创建到销毁的过程,就是该实例的生命周期。从Java的角度来理解,就是一个对象从创建到被回收的过程。Vue实例在整个生命周期会经历以下四个主要过程:***创建,挂载,更新,卸载。***因此也就出现了8个切面,我感觉之所以要了解这些生命周期主要是为了在不同的切面处运行我们的代码,比如通过接口请求数据。
学习新的技术一般没有比官网更好的教程了,首先来看官网的图示介绍
Vue生命周期

四个主要过程做了什么(了解开发中如何简单使用)

  1. 创建,对应两个生命周期钩子:beforeCreate,created。创建时完成了data,methods,watch等的初始化,这也就是为什么在created就可以调用接口去请求数据。
  2. 挂载,对应两个生命周期钩子:beforeMount,mounted。在created到beforeMount之间,Vue会将template转化为render函数,中间关于虚拟dom和diff算法的部分,后面有时间会进行记录。在mounted里,我们可以操作dom,已挂载完毕。
  3. 更新,对应钩子:beforeUpdate,updated。在状态数据发生改变时,会比对新旧dom,进而决定是否更新。这里有一个地方在参考别人的博客时注意到,在mounted和updated执行时,页面不会加载完全部子组件,如果希望在视图完全加载之后进行的操作,请一定加上$nextTick()。
  4. 卸载(销毁)这就是该实例在使用完毕之后要进行轻理,销毁操作,对应钩子:beforeDestroy,destroyed。

参考博客https://blog.csdn.net/weixin_42707287/article/details/111641286

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值