uniapp 使用pinpa 持續化更新

心动12138發表於2024-11-18
APP
安裝依賴
   npm i pinia
   npm i pinia-plugin-persistedstate

新建 index.ts

import { createPinia } from 'pinia'
import { createPersistedState } from 'pinia-plugin-persistedstate' // 資料持久化

const store = createPinia()
store.use(
  createPersistedState({
    storage: {
      getItem: uni.getStorageSync,
      setItem: uni.setStorageSync,
    },
  }),
)

export default store


export * from './user'

新建 uesr.ts
　

import { defineStore } from "pinia";
import { reactive, ref } from "vue";
export const useUserStore = defineStore(
  "user",
  () => {
    const data = ref(999);
    const cktjia = () => {
      data.value++;
    };return {
      data,
      cktjia
    };
  },
  {
    persist: true, // 開啟後對 state 的資料讀寫都將持久化
  }
);

min.ts 檔案

　

import store from './store'


 app.use(store)

相關文章