微信小程序使用pinia-plugin-persistedstate报错找不到localstorage

因为微信小程序种是没有localstorage.setItem的方法的。所以要再使用持久化之后改成一下存储方式

persist.ts

复制代码
import {PersistedStateOptions} from "pinia-plugin-persistedstate";

/**
 * @description pinia 持久化参数配置
 * @param {String} key 存储到持久化的 name
 * @param {Array} paths 需要持久化的 state name
 * @return persist
 * */
const piniaPersistConfig = (key: string, paths?: string[]) => {
    const persist: PersistedStateOptions = {
        key,
        storage: {
            setItem(key, value) {
                uni.setStorageSync(key, value) // [!code warning]
            },
            getItem(key) {
                return uni.getStorageSync(key) // [!code warning]
            },
        },
        // storage: sessionStorage,
        paths
    };
    return persist;
};

export default piniaPersistConfig;

然后在 定义缓存的内容就可以啦

复制代码
import { defineStore } from 'pinia'
import piniaPersistConfig from "./persist";//上面写的哪个文件
复制代码
export interface State {
  userInfo: any;
  globalData: any;
  timerLock: boolean;
  showLoading:boolean;
}
// @ts-ignore
export const useCommonStore = defineStore('pack-store', {
  persist: piniaPersistConfig("pack-store"),
  state: (): State => ({
    userInfo: {},
    globalData: {},
    timerLock: false, //是否关闭合成定时器
    showLoading:false,//loading是否显示
  }),
  getters: {},
  actions: {
    setuserInfo(state: State, data: any){
      this.userInfo = data;
    },
    setGlobalData(data: any){
      this.globalData = Object.assign({}, this.globalData, data);
      console.log("state.globalData", this.globalData);
    },
    logout(){
      uni.removeStorageSync("userInfo");
      uni.removeStorageSync("token");
      uni.removeStorageSync("openInfo");
      uni.clearStorage();
      uni.clearStorageSync();
      this.userInfo = {};
      this.timerLock = true;
    },
    setTimerLock (data: boolean){
      this.timerLock = data;
    },
    setChangeLoading(data:boolean){
      console.log("changeLoading",data)
      this.showLoading = data;
    },
  },
});
相关推荐
sheji341614 小时前
【开题答辩全过程】以 基于微信小程序的社区养老积分银行系统的设计为例,包含答辩的问题和答案
微信小程序·小程序
CHU72903515 小时前
在线教学课堂APP前端功能:搭建高效线上教学生态
前端·人工智能·小程序·php
2501_9160074721 小时前
跨平台 App 安全,Flutter、RN、Unity、H5 混合应用加固
android·ios·小程序·https·uni-app·iphone·webview
焦糖玛奇朵婷21 小时前
就医陪诊小程序|从软件开发视角看实用度✨
java·大数据·jvm·算法·小程序
CHU7290351 天前
智慧陪伴新选择:陪诊陪护预约小程序的暖心功能解析
java·前端·小程序·php
2501_916007471 天前
不越狱如何查看iOS 应用的详细信息及其文件目录结构
android·macos·ios·小程序·uni-app·cocoa·iphone
李慕婉学姐1 天前
【开题答辩过程】以《基于uni-app的手账记录小程序的设计与实现》为例,不知道这个选题怎么做的,不知道这个选题怎么开题答辩的可以进来看看
java·小程序·uni-app
前端 贾公子1 天前
npm 发包配置双重身份验证
前端·javascript·微信小程序·小程序·github
2501_916008891 天前
无需钥匙串快速创建 iOS 开发 / 发布证书 P12 CSR
android·ios·小程序·https·uni-app·iphone·webview