vue基础 - 24 （vue3 生命周期：onBeforeMount、onMounted、onBeforeUpdate、onUpdated、onBeforeUnmount、onUnmounted）

setup相当于之前的created周期：创建时onBeforeMount：DOM即将挂载onMounted：DOM挂载完毕onBeforeUpdate：DOM即将更新onUpdated：DOM更新完毕onBeforeUnmount：即将销毁onUnmounted：销毁完毕<script lang="ts">import { defineComponen...

黑猫了个怪怪

42256人浏览 · 2021-12-05 22:07:24

黑猫了个怪怪 · 2021-12-05 22:07:24 发布

setup相当于之前的created周期：创建时

onBeforeMount：DOM即将挂载

onMounted：DOM挂载完毕

onBeforeUpdate：DOM即将更新

onUpdated：DOM更新完毕

onBeforeUnmount：即将销毁

onUnmounted：销毁完毕

<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>