文章目录
定义
Vue的生命周期钩子是指Vue实例从创建到销毁的过程中,Vue运行时自动调用的一系列方法。
生命周期有哪些?
未引入keep-alive组件
beforeCreate:在实例初始化之后,数据观测和事件/侦听器的配置之前被调用
created:在实例创建完成后被立即调用,此时可以访问到组件的数据和方法
beforeMounted:在挂载开始之前被调用,相关的DOM还未被渲染
mounted:被调用时,实例已完成DOM的挂载
beforeUpdate:在数据更新之前调用
updated:在数据更新后调用
beforeDestroy:在Vue实例销毁之前调用
destroyed:Vue实例销毁后调用
加入keep-alive组件
beforeCreate
created
beforeMount
mounted
beforeUpdate
updated
beforeDestroy
destroyed
activated
deactivated
请求放在mounted还是created?
这个问题具体要看项目和业务的情况了,因为组件的加载顺序是,父组件引入了子组件,那么先执行父的前3个生命周期,再执行子的前4个生命周期,那么如果我们的业务是父组件引入子组件,并且优先加载子组件的数据,那么在父组件中当前的请求要房mounted中,如果当前组件没有依赖关系那么放在哪个生命周期中请求都是可以的。
为什么请求不放在beforeCreate?
如果请求是在methods封装好了,在beforeCreate调用的时候,beforeCreate阶段是拿不到methods里面的方法的(会报错了)。
beforeCreate和created有什么区别
beforeCreate没有$data
created中有$data
created是可以拿到methods的方法的
beforeCreate拿不到methods的方法
父组件引入子组件,那么生命周期执行的顺序是?
父:beforeCreate、created、beforeMount
子:beforeCreate、created、beforeMount、mounted
...
父:mounted
第二次或者第N次进去组件会执行哪些生命周期?
如果当前组件加入了keep-alive,只会执行一个生命周期:activated
如果没有加入keep-alive
beforeCreate
created
beforeMount
mounted
加入keep-alive会执行哪些生命周期?
如果使用了keep-alive组件,当前的组件会额外增加2个生命周期(系统8 + 2 )
activated
deactivated
如果当前组件加入了keep-alive第一次进入这个组件会执行5个生命周期
beforeCreate
created
beforeMount
mounted
activated
你在什么情况下用过哪些生命周期?说一说生命周期使用场景
created ===> 单组件请求
mounted ===> 同步可以获取dom,如果先子组件请求后父组件请求
activated ===> 判断id是否相等,如果不相同发起请求
destroyed ===> 关闭页面记录视频播放的时间,初始化的时候从上一次的历史开始播放