怎么在Vue3+Vite+pinia+ts中使用 Pinia持久化数据

最近开启了Vue3+ vite + Pinia的项目，发现官方仓库下面有个状态库Pinia，使用Pinia 过程中， 需要用到一些持久化的场景，比如token等数据，为了不直接被人获取到，想找个可以直接使用的带加密的Pinia持久化库， 搜了一下没有看到比较成熟的持久化库（vuex持久化库可以配合加密使用）

最后通过搜索 找到一个库，pinia-use-persist, 集成了加密和持久化的效果，记录一下使用过程：

这个库可以通过配置式开启 加密和存储的 Storage类型（比如loclStorage或者sessionStorage、cookie等）

使用效果非常好

• 使用过程

npm i pinia-use-persist

// main.ts
import {createApp} from 'vue'
import App from './App.vue'
import {createPinia} from "pinia";
import {usePersist} from "pinia-use-persist";
import plugin from "./plugin";

const pinia = createPinia()
pinia.use(usePersist)

createApp(App).use(pinia).use(plugin).mount('#app')

创建store.ts

import {defineStore} from "pinia";

export const useStore = defineStore('main', {
  state: () => ({
    counter: 0,
  }),
  persist: {
    enabled: true,
    encryptionKey: 'my-test',
  }
})

在 vue文件中使用

打开控制台可以查看到对应的存储加密