pinia+piniaPluginPersistedstate实现本地永久化存储

1安装依赖 pinia-plugin-persistedstate

2 main.ts引入

import piniaPluginPersistedstate from "pinia-plugin-persistedstate";

const pinia = createPinia();

pinia.use(piniaPluginPersistedstate);

app.use(pinia);

3 页面使用 // persist: true,

import { defineStore } from "pinia";
export const useCounterStore = defineStore("counterStore", {
  state: () => {
    return {
      // 所有这些属性都将自动推断其类型,如果推断失败可以试下 as xxx
      counter1: 10,
      counter2: 10,
      name: "name",
    };
  },

  // 相当于vuex的 mutation + action，可以同时写同步和异步的代码
  actions: {
    increment() {
      //this.是store实例
      this.counter1++;
      this.counter2--;
    },
  },
  persist: true,
  //配合插件 持久化