vue3生命周期
setup() - 等同于vue2x中的beforeCreate与created
onBeforeMount() : 组件挂载到节点上之前执行的函数。
onMounted() : 组件挂载完成后执行的函数。
onBeforeUpdate(): 组件更新之前执行的函数。
onUpdated(): 组件更新完成之后执行的函数。
onBeforeUnmount(): 组件卸载之前执行的函数。
onUnmounted(): 组件卸载完成后执行的函数
onActivated(): 被包含在中的组件,会多出两个生命周期钩子函数。被激活时执行
onDeactivated(): 比如从 A 组件,切换到 B 组件,A 组件消失时执行。
onErrorCaptured(): 当捕获一个来自子孙组件的异常时激活钩子函数。
<script lang="ts">
import { defineComponent, onBeforeMount,onMounted } from 'vue'
//声明周期:vue3中名称发生了变更
//setup相当于之前的created周期:创建时
export default defineComponent({
setup () {
onBeforeMount(() => {
console.log("DOM即将挂载");
})
onMounted(() => {
console.log("DOM挂载完毕");
})
// onBeforeUpdate(() => {}) DOM即将更新
// onUpdated(() => {}) DOM更新完毕
// onBeforeUnmount(() => {}) 即将销毁
// onUnmounted(() => {}) 销毁完毕
return {}
}
})
</script>