uni-app中vue3生命周期—相比vue2增加了beforeUnmount–unmounted–renderTracked–renderTriggered 共13个
生命周期钩子 | 描述 | H5 | App端 | 微信小程序 |
---|---|---|---|---|
beforeCreate | 在实例初始化之后,数据观测(data observer) 和 event/watcher 事件配置之前被调用。详情 | √ | √ | √ |
created | 在实例创建完成后被立即调用。详情 | √ | √ | √ |
beforeMount | 在挂载开始之前被调用:相关的 render 函数首次被调用。详情 | √ | √ | √ |
mounted | 实例被挂载后调用,这时 Vue.createApp({}).mount() 被新创建的 vm.$el 替换了。详情 | √ | √ | √ |
beforeUpdate | 数据更新时调用,发生在虚拟 DOM 打补丁之前。详情 | √ | √ | √ |
updated | 由于数据更改导致的虚拟 DOM 重新渲染和打补丁,在这之后会调用该钩子。详情 | √ | √ | √ |
activated | 被 keep-alive 缓存的组件激活时调用。详情 | √ | √ | x |
deactivated | 被 keep-alive 缓存的组件停用时调用。详情 | √ | √ | x |
beforeUnmount | 在卸载组件实例之前调用。在这个阶段,实例仍然是完全正常的。详情 | √ | √ | √ |
unmounted | 卸载组件实例后调用。调用此钩子时,组件实例的所有指令都被解除绑定,所有事件侦听器都被移除,所有子组件实例被卸载。详情 | √ | √ | √ |
errorCaptured | 当捕获一个来自子孙组件的错误时被调用。此钩子会收到三个参数:错误对象、发生错误的组件实例以及一个包含错误来源信息的字符串。详情 | √ | √ | √ |
renderTracked | 跟踪虚拟 DOM 重新渲染时调用。钩子接收 debugger event 作为参数。此事件告诉你哪个操作跟踪了组件以及该操作的目标对象和键。详情 | √ | √ | √ |
renderTriggered | 当虚拟 DOM 重新渲染为 triggered.Similarly 为renderTracked ,接收 debugger event 作为参数。此事件告诉你是什么操作触发了重新渲染,以及该操作的目标对象和键。详情 | √ | √ | √ |
相比vue2增加
beforeUnmount | 在卸载组件实例之前调用。在这个阶段,实例仍然是完全正常的。详情 | √ | √ | √ |
---|---|---|---|---|
unmounted | 卸载组件实例后调用。调用此钩子时,组件实例的所有指令都被解除绑定,所有事件侦听器都被移除,所有子组件实例被卸载。详情 | √ | √ | √ |
errorCaptured | 当捕获一个来自子孙组件的错误时被调用。此钩子会收到三个参数:错误对象、发生错误的组件实例以及一个包含错误来源信息的字符串。详情 | √ | √ | √ |
renderTracked | 跟踪虚拟 DOM 重新渲染时调用。钩子接收 debugger event 作为参数。此事件告诉你哪个操作跟踪了组件以及该操作的目标对象和键。详情 | √ | √ | √ |
renderTriggered | 当虚拟 DOM 重新渲染为 triggered.Similarly 为renderTracked ,接收 debugger event 作为参数。此事件告诉你是什么操作触发了重新渲染,以及该操作的目标对象和键。详情 | √ | √ | √ |