Pinia - 构建用户仓库 和 持久化

发布时间 2023-08-05 10:36:54作者: RealityAndLife

官方文档:https://prazdevs.github.io/pinia-plugin-persistedstate/zh/

  1. 安装插件 pinia-plugin-persistedstate

pnpm add pinia-plugin-persistedstate -D
  1. 使用 main.js配置

import persist from 'pinia-plugin-persistedstate'
...
app.use(createPinia().use(persist))
  1. 配置 stores/user.js

import { defineStore } from 'pinia'
import { ref } from 'vue'
​
// 用户模块
export const useUserStore = defineStore('big-user',() => {
    const token = ref('') // 定义 token
    const setToken = (t) => (token.value = t) // 设置 token
    //导出
    return { token, setToken }
  },
  {
    persist: true // 开启持久化
//其他配置请参照官网文档:https://prazdevs.github.io/pinia-plugin-persistedstate/zh/guide/config.html
  }
)
​