从'vue'中引入的生命周期函数,这些生命周期钩子注册函数只能在setup()期间同步使用
因为它们依赖于内部的全局状态来定位当前组件实例(正在调用setup()的组件实例),
不在当前组件下调用这些函数会抛出一个错误。
即可以从其他文件引入使用了生命周期的函数等,放在setup中执行
和外部的生命周期函数相比,会优先指向setUp内的生命周期函数,再去执行外部的生命周期函数
修改两个生命周期函数
onBeforeUnmount 对应beforeDestroy
在卸载组件实例之前调用。在这个阶段,实例仍然是完全正常的。
onUnmounted 对应destroyed
卸载组件实例后调用,调用此钩子时,组件实例的所有指令都被解除绑定,
所有事件侦听器都被移除,所有子组件实例被卸载。
<script>
//生命周期函数新写法
const app = Vue.createApp({
//beforeMount => onBeforeMount
//mounted => onMounted
//beforeUpdated => onBeforeUpdate
//updated => onUpdated
//beforeUnmount => onBeforeUnmount
//unmouted => onUnmounted
setup() {
//
const { ref, onBeforeMount, onMounted, onBeforeUpdate,
onUpdated, onBeforeUnmount, onUnmounted, onRenderTracked, onRenderTriggered } = Vue;
c