【Vue3】组合式API

组合式 API 是 Vue 3 中引入的一种新的开发方式，旨在提供更灵活、可组合和可维护的代码结构。它通过 setup 函数和一系列的函数和逻辑组合，可以更好地组织和复用组件的逻辑。

下面是一些组合式 API 的特性和用法：

1. setup 函数：每个组件都必须包含一个 setup 函数，它是组合式 API 的入口点。在 setup 函数中，可以设置组件的初始状态、定义响应式数据、创建计算属性、监听事件等。

2. 响应式数据：使用 ref 和 reactive 函数来创建响应式数据。ref 用于创建单个值的响应式数据，而 reactive 用于创建包含多个值的响应式数据。

3. 计算属性：使用 computed 函数创建计算属性。计算属性可以基于响应式数据进行计算，当依赖的响应式数据发生变化时，计算属性会自动更新。

4. 监听器：使用 watch 函数创建监听器。监听器可以用于监听响应式数据的变化，并在变化时执行相应的操作。

5. 生命周期钩子函数：Vue 3 中的生命周期钩子函数被重新设计为了钩子函数。可以在 setup 函数中使用 onXXX 形式的钩子函数来执行对应的操作。

6. 自定义逻辑组合：可以自定义组合函数，将多个逻辑函数组合在一起，以实现更高级的逻辑复用。通过使用 provide 和 inject 函数，还可以在组件之间共享状态和逻辑。

7. 组件引用：使用 ref 函数可以创建对其他组件的引用。可以在组合式 API 中访问其他组件的实例和属性。

总结：组合式 API 是 Vue 3 中引入的一种新的开发方式，通过 setup 函数和一系列的函数和逻辑组合，可以更灵活、可组合和可维护地编写组件。它提供了响应式数据、计算属性、监听器、生命周期钩子函数、自定义逻辑组合等特性，以及组件引用和状态共享机制。组合式 API 可以更好地组织和复用组件的逻辑，并提高代码的可读性和可维护性。