25
2020
08

详细说一下你对vue生命周期的理解

vue生命周期指的是vue实例从创建到销毁的过程。包括8个阶段,创建前/后、渲染前/后、更新前/后、销毁前/后。


v2-86c8b04dbb2221c9da0679b03dc9f8d7_b.jpg

beforeCreate(创建前):vue实例的挂载元素$el和数据对象data都为undefined,还未初始化。

created(创建后):vue实例的数据对象data有了,但是$el还没有。

beforeMounte(渲染前):vue实例的$el和data都初始化了,但是挂载之前还是虚拟的dom,data.message还未替换

mounted(渲染后):vue实例挂载完成,data.message成功渲染。

beforeUpdate(更新前):数据更新之前调用,发生在虚拟DOM重新渲染和打补丁之前。可以在该钩子中进一步地更改状态,不会触发附加的重渲染过程。

updated(更新后):在由于数据更改导致的虚拟DOM重新渲染和打补丁之后调用。调用时,组件DOM已经更新,所以可以执行依赖于DOM的操作。然而在大多数情况下,应该避免在此期间更改状态,因为这可能会导致更新无限循环。该钩子在服务器端渲染期间不被调用。

beforeDestroy(销毁前):在实例销毁之前调用。实例仍然完全可用。

destroyed(销毁后): 在实例销毁之后调用。调用后,所有的事件监听器会被移除,所有的子实例也会被销毁。该钩子在服务器端渲染期间不被调用。


1、第一次加载时会触发那些生命周期

答:会触发:beforeCreate(创建前)、created(创建后)、beforeMounte(渲染前)、mounted(渲染后)

2、、生命周期的作用

答:控制整个vue实例的过程时会形成更好的逻辑

3、vue页面请求时一般放在那个生命周期里

答:一般放在created或者mounted里面,看实际的需求,区别是created 页面还没渲染如果要操作dom节点的话没法找到dom,在mounted里面请求,dom渲染完毕, 你再去请求数据就会有空壳dom的情况, 影响布局

« 上一篇 下一篇 »

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。