主要通过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.pswp.cn/bicheng/90495.shtml
繁体地址,请注明出处:http://hk.pswp.cn/bicheng/90495.shtml
英文地址,请注明出处:http://en.pswp.cn/bicheng/90495.shtml

如若内容造成侵权/违法违规/事实不符,请联系英文站点网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

抖音小游戏好做吗?

从0到1&#xff0c;教你打造爆款抖音小游戏随着移动互联网的发展&#xff0c;抖音小游戏凭借便捷即玩、流量庞大等优势&#xff0c;成为游戏开发者的热门选择。想知道如何开发出一款吸睛又好玩的抖音小游戏吗&#xff1f;下面就为你详细介绍开发流程。一、前期规划明确游戏类型…

Spring Boot 3核心技术面试指南:从迁移升级到云原生实战,9轮技术攻防(含架构解析)

面试官&#xff1a;cc程序员&#xff0c;聊聊Spring Boot 3的那些事儿&#xff1f; 场景背景 互联网大厂云原生架构部面试官老王&#xff0c;与自称"Spring Boot骨灰粉"的cc程序员展开技术对决。 面试过程 第一轮&#xff1a;迁移升级 面试官&#xff1a;Spring Boot…

技术演进中的开发沉思-42 MFC系列:Components 与 ActiveX Controls

点击程序启动时&#xff0c;是不是看过有加载的画面。在VC开发时&#xff0c;可使用 VC 的 Component Gallery&#xff0c;找到 Splash screen 组件&#xff0c;当时觉得组件就是给程序员的暖手宝。一、Component GalleryComponent Gallery 在 VC 里的位置很特别 —— 它藏在 “…

抽象类、接口、枚举

第八天&#xff08;坚持&#xff09;抽象类1.什么是抽象类&#xff0c;作用特点。抽象类是面向对象编程中一种特殊的类&#xff0c;它不能被实例化&#xff0c;主要用于作为其他类的基类&#xff08;父类&#xff09;。抽象类的主要作用是定义公共结构和行为规范&#xff0c;同…

在Ubuntu上使用QEMU仿真运行ARM汇编

ARM汇编一般无法在PC上直接运行&#xff0c;因为ARM和x86架构是不一样的。但是很多时候用ARM开发板是很不方便的&#xff0c;所以能不能直接在PC上仿真运行ARM汇编来练习呢&#xff1f;当然可以&#xff0c;那就是&#xff1a;使用QEMU来仿真。这篇文章我们就来演示下如何在Ubu…

【趣味解读】淘宝登录的前后端交互机制:Cookie-Session 如何保障你的账户安全?

在现代Web应用中&#xff0c;前后端交互是核心功能之一&#xff0c;而用户认证又是其中最关键的部分。本文将以淘宝登录为例&#xff0c;详细解析基于Cookie-Session的前后端交互流程&#xff0c;帮助开发者理解这一常见的安全认证机制。生动理解一下什么是cookie和seesion我们…

贪心算法(基础算法)

1.引言 ok啊&#xff0c;拖更这么长时间也是没有压力&#xff08;doge&#xff09; 不说啥&#xff0c;直接进入正题。 2.概念 这个贪心算法呢&#xff0c;看名字就知道&#xff0c;不就是每个步骤都挑最好的嘛&#xff0c;有啥难的。 这么说的话......其实确实&#xff0c…

简单的mcp 服务示例

参考&#xff1a;https://www.bilibili.com/video/BV1nyVDzaE1x 编写自己的tools.py #### tools.py from pathlib import Path import osbase_dir Path("./test")def read_file(name: str) -> str:"""Return file content. If not exist, return …

DeepSeek-R1+豆包迭代一次完成中国象棋游戏

DeepSeeek- R1生成的棋盘符合中国象棋风&#xff0c;单独豆包无法画好象棋棋盘。提示词&#xff1a;使用html实现中国象棋游戏&#xff0c;要求支持人机对弈。等等&#xff0c;你需要实现完整版本。代码如下&#xff08;电脑走棋不对&#xff09;&#xff1a;<!DOCTYPE html…

阿里通义千问Qwen3深夜升级:架构革新+性能碾压

&#xff08;以下借助 DeepSeek-R1 & Grok3 辅助整理&#xff09; 北京时间2025年7月22日凌晨&#xff0c;阿里云通义千问团队发布了Qwen3旗舰模型的最新更新——Qwen3-235B-A22B-Instruct-2507-FP8。这一更新不仅在性能上实现了突破&#xff0c;还标志着开源大模型技术架…

pip关于缓存的用法

pip cache info查看 pip 缓存的大小&#xff0c;运行示例 Package index page cache location (pip v23.3): c:\users\xxx\appdata\local\pip\cache\http-v2 Package index page cache location (older pips): c:\users\xxx\appdata\local\pip\cache\http Package index page c…

嵌入式学习-(李宏毅)机器学习(2)-day29

十五个作业不同类型的Functions两大类任务一个是Regression&#xff08;回归&#xff09; 一个是 Classification&#xff08;分类&#xff09;一个是给出一个数值&#xff0c;一个是从类别中选择一个还有一类任务 Structured Learning 机器要学会创造文件 机器学习预测频道第…

【C++11】哈希表与无序容器:从概念到应用

文章目录一、前言二、哈希表&#xff08;Hash Table&#xff09;1. 基本概念2. 哈希函数3. 冲突解决方法链地址法&#xff08;Separate Chaining&#xff09;开放寻址法&#xff08;Open Addressing&#xff09;4. 性能分析5. 动态扩容6. 应用场景7. 优缺点二. 无序容器的介绍1…

【智能大数据分析 | 实验二】Spark实验:部署Spark集群

【作者主页】Francek Chen 【专栏介绍】⌈⌈⌈智能大数据分析⌋⌋⌋ 智能大数据分析是指利用先进的技术和算法对大规模数据进行深入分析和挖掘&#xff0c;以提取有价值的信息和洞察。它结合了大数据技术、人工智能&#xff08;AI&#xff09;、机器学习&#xff08;ML&#xf…

使用pymongo进行MongoDB的回收

在 PyMongo 中使用 compact 命令进行 MongoDB 碎片回收的完整操作指南如下&#xff1a; 一、核心执行方法 from pymongo import MongoClient import time# 1. 连接到 MongoDB 实例 client MongoClient("mongodb://username:passwordhost:27017/dbname?authSourceadmin&q…

Azure DevOps 使用服务主体配置自托管代理 (Self-hosted Agent) 配置指南

Azure DevOps 使用服务主体配置自托管代理配置指南1. 概述2. 在 Azure AD 中创建服务主体 (SP)3. 授予 Azure DevOps 权限3.1. 组织层级&#xff1a;用户身份与访问级别3.2. 组织层级&#xff1a;Agent pools管理员3.3. 在 Linux VM 上安装和配置代理3.4. 启动并设置为系统服务…

Java学习第六十四部分——Nginx

目录 一、前言提要 二、核心特点 三、核心作用 四、架构优势 五、应用场景 六、常用命令 七、性能对比——Nginx vs Apache 八、典型用户 九、配置示例 十、Java应用需配合的配置 十一、性能优化策略 十二、常见问题排查 十三、文件结构配置 十四、总结归纳概述 …

几个常用的Oxygen编辑器插件

Oxygen XML Editor是罗马尼亚的SyncroSoft公司开发的结构化文档编辑和发布软件。 除了Oxygen编辑器带的功能&#xff0c;它还提供了丰富的插件来提供额外的功能来辅助资料开发人员更高效率、更低成本地开发结构化资料。 本文介绍几个比较常用和有用的插件。 - 1 - Git Clie…

基于springboot的软件缺陷管理跟踪平台

博主介绍&#xff1a;java高级开发&#xff0c;从事互联网行业六年&#xff0c;熟悉各种主流语言&#xff0c;精通java、python、php、爬虫、web开发&#xff0c;已经做了六年的毕业设计程序开发&#xff0c;开发过上千套毕业设计程序&#xff0c;没有什么华丽的语言&#xff0…

【LINUX】Centos 9使用nmcli更改IP

1. 查看连接名称 nmcli connection show输出类似&#xff1a; NAME UUID TYPE DEVICE Wired connection 1 xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx ethernet enp1s02. 修改 IP 地址&#xff08;以静态 IP 为例&#xf…