uniapp安装pinia

### 如何在 UniApp 中安装配置 Pinia 状态管理

#### 安装 Pinia 和相关插件
为了在 UniApp 项目中使用 Pinia 进行状态管理，需先通过包管理工具安装 Pinia 及其持久化插件。对于 `pnpm` 用户而言：

pnpm install pinia
pnpm install pinia-plugin-persistedstate

这一步骤确保了项目能够访问到最新的 Pinia 功能以及支持数据持久化的特性[^2]。

#### 配置 Pinia 库
接着，在项目的入口文件（通常是 main.js 或 app.vue）里初始化并注册 Pinia 实例。具体操作如下所示：

// 导入必要的模块
import { createApp } from 'vue';
import App from './App.vue';
import { store, key } from '@/store'; // 自定义路径可能有所不同

const app = createApp(App);

// 使用 Pinia 插件
app.use(store, key).mount('#app');

上述代码片段展示了如何将 Pinia 整合进 Vue 应用程序之中，并将其挂载至应用实例上以便全局可用[^3]。

#### 创建 Store 文件结构
按照最佳实践建议，应该为不同的功能模块分别建立独立的状态仓库 (Store)，比如可以创建一个名为 `stores/userColorStore.js` 的文件来保存用户的颜色偏好设置等信息:

import { defineStore } from 'pinia';

export const useUserColorStore = defineStore('userColor', {
    state: () => ({
        favoriteColor: '#ffffff',
    }),
    actions: {
        changeFavoriteColor(newColor) {
            this.favoriteColor = newColor;
        }
    },
});

这段 JavaScript 代码定义了一个简单的存储单元用于处理用户喜欢的颜色属性及其变更逻辑[^5]。

#### 启动与验证配置
完成以上步骤之后，重启开发服务器以加载新的更改。此时可以在页面组件内部尝试调用之前定义好的 action 方法来进行交互测试，确认一切正常工作。