vue 生命周期钩子详解,vue生命周期常用的四个钩子函数,3.vue生命周期钩子函数有哪些?,vue生命周期active,vue组件生命周期钩子,vue生命周期有哪些钩子函数
Vue 3.0 的组合式 API 是一种新的 API，它允许您将逻辑代码按照功能进行组织和封装，而不是按照生命周期钩子或选项属性。这种方式更加灵活且易于复用和测试。

生命周期钩子是 Vue 组件在其生命周期内执行的特定函数。在组合式 API 中，生命周期钩子可以使用 onXXX 命名约定来定义。例如，如果您想在组件挂载后执行某个操作，可以定义一个 onMounted 钩子。以下是 Vue 3.0 组合式 API 的生命周期钩子：

- onBeforeMount: 在组件挂载之前调用
- onMounted: 在组件挂载后调用
- onBeforeUpdate: 在组件更新之前调用
- onUpdated: 在组件更新后调用
- onBeforeUnmount: 在组件卸载之前调用
- onUnmounted: 在组件卸载后调用
- onActivated: 在 keep-alive 组件激活时调用
- onDeactivated: 在 keep-alive 组件停用时调用
- onErrorCaptured: 在捕获到错误时调用

下面是一个示例组件，其中定义了 onMounted 和 onUnmounted 钩子：

vue
<template>
<div>{{ count }}</div>
</template>

<script>
import { ref, onMounted, onUnmounted } from 'vue'

export default {
setup() {
const count = ref(0)

// 在组件挂载后增加计数器
onMounted(() => {
setInterval(() => count.value++, 1000)
})

// 在组件卸载前停止计数器
onUnmounted(() => {
clearInterval(intervalId)
})

return {
count
}
}
}
</script>


这个示例组件定义了一个 count 变量，它的值每秒钟递增一次。onMounted 钩子用于在组件挂载后启动计数器，而 onUnmounted 钩子用于在组件卸载前停止计数器。