当前位置: 首页 > news >正文

taro+pinia+小程序存储配置持久化

主要通过taro的getStorageSync,setStorageSync实现配置持久化

// https://pinia.esm.dev/introduction.html
import { defineStore } from 'pinia';
import { CreditCardDateUtils } from '@/untils/compute';
import { getStorageSync, setStorageSync } from "@tarojs/taro";interface dataType {id: string,name: string,statementDay: number,//出账日dueDay: number,//还款日dueDate?: string,//还款日freeDay?: number,//免息天数currentFreeDay: number,//剩余免息天数isCurrentCycle: boolean,//是否本周期
}export const useCardStore = defineStore('card', {state: () => {return {_cardData: <dataType[]>[],};},getters: {getCardInfo: state => {return (id: string) => state._cardData.find((item) => (item.id === id));},getCardDataList: state => {return () => state._cardData;},getIndexCardDataList: state => {const dataList = state._cardData.map((item) => {const creditCardUtils = new CreditCardDateUtils(Number(item.statementDay), Number(item.dueDay));item.freeDay = creditCardUtils.calculateMonthlyGracePeriod();item.currentFreeDay = creditCardUtils.calculateGracePeriodDays();const { dueDate, isCurrentCycle } = creditCardUtils.getCreditCardDueDate();item.dueDate = dueDate.toLocaleDateString();item.isCurrentCycle = isCurrentCycle;return item;}).sort((a, b) => {// 1. 当前周期的卡片优先if (a.isCurrentCycle && !b.isCurrentCycle) return -1;if (!a.isCurrentCycle && b.isCurrentCycle) return 1;// 2. 同一周期内按剩余免息天数降序排列return b.currentFreeDay - a.currentFreeDay;});console.log(dataList, 'dataList')return () => dataList;}},actions: {delCardData(id: string) {this._cardData = this._cardData.filter((item) => item.id !== id);console.log(id);console.log(this._cardData);},setCardData(cardData: dataType) {const index = this._cardData.findIndex((item: dataType) => item.id == cardData.id);console.log(this._cardData, 'this._cardData');console.log(cardData, 'cardData');console.log(index, 'index');if (index <= -1) {this._cardData.push(cardData);} else {this._cardData[index] = cardData;}},},// persist: true,// 配置持久化persist: {// 调整为兼容多端的APIstorage: {setItem(key, value) {setStorageSync(key, value) // [!code warning]},getItem(key) {return getStorageSync(key) // [!code warning]}},}
})
http://www.lryc.cn/news/594577.html

相关文章:

  • 微美全息(WIMI.US)聚焦多元哈希锁机制,为链上链下数据可信交互按下加速键
  • 快速入门SwiftUI
  • 【大模型】结构化提示词:让AI高效完成复杂任务的“编程语言”
  • JavaEE初阶第十期:解锁多线程,从 “单车道” 到 “高速公路” 的编程升级(八)
  • 经典神经网络(vgg resnet googlenet)
  • LiteCoT:难度感知的推理链压缩与高效蒸馏框架
  • Apache IoTDB(2):时序数据库 IoTDB 集群安装部署的技术优势与适用场景分析
  • 卫朋:华为流程体系拆解系列之高阶流程L1-L3分解三阶七步法
  • 深入详解随机森林在放射治疗计划优化中的应用及实现细节
  • 【Elasticsearch】BM25的discount_overlaps参数
  • Qt中的网络通信
  • Lua:小巧而强大的脚本语言,游戏与嵌入式的秘密武器
  • 搭建前端页面,介绍对应标签
  • wordle game(猜词游戏)小demo【react + ts】
  • 搭建种草商城框架指南
  • Protein FID:AI蛋白质结构生成模型评估新指标
  • MCP协议解析:如何通过Model Context Protocol 实现高效的AI客户端与服务端交互
  • 基础神经网络模型搭建
  • 【Linux】3. Shell语言
  • 双8无碳小车“cad【17张】三维图+设计说名书
  • XTTS实现语音克隆:精确控制音频格式与生成流程【TTS的实战指南】
  • XSS GAME靶场
  • 仙盟数据库应用-外贸标签打印系统 前端数据库-V8--毕业论文-—-—仙盟创梦IDE
  • Apache基础配置
  • ESMFold 安装教程
  • 深度相机的工作模式(以奥比中光深度相机为例)
  • 近期工作感想:职业规划篇
  • 【RAG Agent】Deep Searcher实现逻辑解析
  • 尚庭公寓--------登陆流程介绍以及功能代码
  • Linux:线程控制