Vue3 生命周期
- beforeCreate：创建之前（、和都还是,不可用的）
- created：创建完毕（能读取到数据的值,但是还没生成）
- beforeMount：挂载之前（生成,但此时还没有挂载中的数据）
- mounted：挂载完毕（已经成功挂载渲染的值）
- beforeUpdate：更新之前
- updated：更新完毕
- beforeDestroy：销毁之前
- destroyed：销毁完毕（实例与视图的关系解绑，再修改的值，视图再也不会更新了）
- activated： 组件激活时调用
- deactivated： 组件停用时调用
注：
- 和 是比较特殊的两个钩子，需要配合使用
- 当引入 的时候，页面第一次进入，钩子的触发顺序 => => ，退出时触发 。当再次进入（前进或者后退）时，只触发。
举例代码：
：Vue 实例的挂载元素$el 和 数据对象data 并未初始化
这里我们在 chrome console里执行以下命令
这里我们在console里执行下命令对 vue实例进行销毁
比较特殊的一个钩子，需要配合使用
:动态组件初始化渲染过程中调用 keep-alive组件激活时调用。
:动态组件移出过程中调用 keep-alive组件停用时调用。
当引入 的时候，页面第一次进入，钩子的触发顺序 => => ，退出时触发 。当再次进入（前进或者后退）时，只触发。
keep-alive 之后页面模板第一次初始化解析变成HTML片段后，再次进入就不在重新解析而是读取内存中的数据，即，只有当数据变化时，才使用VirtualDOM进行diff更新。故，页面进入的数据获取应该在activated中也放一份。数据下载完毕手动操作DOM的部分也应该在activated中执行才会生效。
所以，应该activated中留一份数据获取的代码，或者不要created部分，直接将created中的代码转移到activated中。
示意图：
父beforeCreate -> 父created -> 父beforeMount -> 子beforeCreate -> 子created -> 子beforeMount -> 子mounted -> 父mounted
父beforeUpdate -> 子beforeUpdate -> 子updated->父updated
父beforeDestroy -> 子beforeDestroy -> 子destroyed -> 父destroyed
到此这篇vue2生命周期执行顺序（vue2的生命周期函数）的文章就介绍到这了,更多相关内容请继续浏览下面的相关推荐文章，希望大家都能在编程的领域有一番成就！版权声明：
本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如若内容造成侵权、违法违规、事实不符，请将相关资料发送至xkadmin@xkablog.com进行投诉反馈，一经查实，立即处理！
转载请注明出处，原文链接：https://www.xkablog.com/qdvuejs/45898.html