'@vueuse/core' 如何使用

`@vueuse/core` 是 Vue 3 库 Vue Use 的核心模块，它提供了一些轻量级的实用工具和服务，使得开发者可以更方便地在 Vue 组件中使用响应式数据、计算属性、插槽等功能。以下是基本的使用步骤：

1. **安装**：首先，你需要通过 npm 或 yarn 安装 `@vueuse/core`：

   npm install @vueuse/core
   # 或者
   yarn add @vueuse/core

2. **引入并使用**：在你的 Vue 组件中，你可以导入 `createAppContext` 和其他需要的功能：

   import { createAppContext } from '@vueuse/core';

例如，创建一个响应式的 state 可以这样做：

   const app = createApp(App);
   app.use(createAppContext());
   app.mount('#app');

   // 使用 reactive 创建响应式数据
   const count = app.context.reactive({ value: 0 });

3. **利用提供的功能**：`@vueuse/core` 提供了许多如 `ref`, `watch`, `onMounted`, 等组件内部常用的函数，可以根据实际需求灵活使用。

4. **注意生命周期管理**：在使用过程中，确保你在正确的生命周期钩子（如 `setup` 函数或 `mounted` 生命周期）中使用 `@vueuse/core` 的功能。