深入了解vue2与vue3的生命周期对比
时间:2022-10-30 11:07:28|栏目:vue|点击: 次
周期对比
vue2 | vue3 |
---|---|
beforeCreate | setup |
created | setup |
beforeMount | onBeforeMount |
mounted | onMounted |
beforeUpdate | onBeforeUpdate |
updated | onUpdated |
activeted | onActiveted |
deactiveted | onDeactiveted |
beforeDestory | onBeforeUnmount |
destoryed | onUnmounted |
用法
vue2 中的生命周期与 data / methods 同级别以函数方式使用,比如 created() {}
data() { return {} }, created() { ... }
vue3 中的生命周期 setup 在最外层,不需要按需加载,其他的生命周期得按需加载才能使用
import { omMounted } from 'vue' setup() { onMounted(() => { ... }) }