vue3生命周期
②更新对象的某个属性时,当属性被应用到模板上,会执行更新生命周期,没有被引用到模板上,不会执行更新生命周期。)发生了修改,才会触发更新生命周期,对于没有应用到模板上的响应式数据,即使发生修改,也不会触发更新周期。(1)当是基础数据时,只要发生改变,不管是否应用到组件上,都会执行更新生命周期。①替换整个对象(引用地址发生改变),会执行更新生命周期,2.引入的生命周期是一个函数,传入一个函数代表执行函
一,生命周期
初次加载:
1.setup
创建:组件创建前和创建后执行,包含了beforeCreate
和created
2.beforeMount
挂载前:组件挂载前执行
3.mounted
挂载后:组件挂载后执行
更新:
1.beforeUpdated
更新前执行
2.updated
更新完成后执行
卸载:
1.beforeUnmount
卸载前执行
2.unmounted
卸载后执行
(当直接单击浏览器页签关闭页面时,页面的beforeUnmount
,unmounted
好像不执行,这时需要使用window.onunload
事件来处理业务 以上为个人开发时发现,在网上没有找到资料支持)
异常:
1.errorCaptured
异常捕捉
keepalive
专属
1.actived
组件激活时执行,第一加载也会执行
2.deactived
组件失活时执行,组件卸载时也会执行
二,选项式api
1.在vue3
中,所有生命周期都可以在setup
中以组合式api
引入,使用是在前面加一个on
2.引入的生命周期是一个函数,传入一个函数代表执行函数
import { onMounted } from 'vue';
onMounted(()=>{
console.log('component mounted')
})
二,注意事项
1.vue
的响应式思想是,只有应用到模板上的响应式数据(除了props
)发生了修改,才会触发更新生命周期,对于没有应用到模板上的响应式数据,即使发生修改,也不会触发更新周期。
2.对于组件的props
,要分两种情况讨论
(1)当是基础数据时,只要发生改变,不管是否应用到组件上,都会执行更新生命周期
(2)当是对象时,又可分为两种情况
①替换整个对象(引用地址发生改变),会执行更新生命周期,
②更新对象的某个属性时,当属性被应用到模板上,会执行更新生命周期,没有被引用到模板上,不会执行更新生命周期。
更多推荐
所有评论(0)