uniapp微信小程序开发踩坑日记:Pinia持久化

如果你使用过Pinia,那你应该知道Pinia持久化插件:https://prazdevs.github.io/pinia-plugin-persistedstate/zh/

但由于官方文档提供的说明并不是针对小程序开发,所以我们在使用这个插件实现uniapp小程序开发中Pinia持久化会出现问题

我在CSDN上看了各种文章,在B站上刷了各种视频,AI也被我问烂了,最后将各种资源糅合在一起,拼凑出了一套完整的解决方案,搜索资源的能力真的很重要!

以上是闲聊(手动狗头),以下是uniapp微信小程序开发实现Pinia持久化的完整方法(阅读此文章请结合Pinia持久化插件官方文档:https://prazdevs.github.io/pinia-plugin-persistedstate/zh/)

1、安装依赖

这一步安装官方文档来就好(官方文档:https://prazdevs.github.io/pinia-plugin-persistedstate/zh/)

2、将插件添加到 pinia 实例上

在main.js中加入如下代码

//将pinia持久化插件添加到pinia实例上
import { createPinia } from 'pinia'
import piniaPluginPersistedstate from 'pinia-plugin-persistedstate' //导入pinia持久化插件
const pinia = createPinia()
app.use(pinia.use(piniaPluginPersistedstate)); //pinia插件的安装配置(千万别忘了这步!!!)

3、用法

这一步与官方文档有所不同,插件默认使用 localStorage 实现持久化,小程序端不兼容,需要替换持久化 API

组合式API下,配置持久化的具体代码如下(主要式persist的部分和官方文档不同),选项式API也类似:

import { defineStore } from 'pinia'export const useStore = defineStore('main',() => {const someState = ref('你好 pinia')return { someState }},{// 配置持久化persist: {// 调整为兼容多端的APIstorage: {setItem(key, value) {uni.setStorageSync(key, value) // [!code warning]},getItem(key) {return uni.getStorageSync(key) // [!code warning]},},},
},
)

完成以上三个步骤后,所有Pinia仓库中的数据都会被保存在本地

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://xiahunao.cn/news/2780071.html

如若内容造成侵权/违法违规/事实不符,请联系瞎胡闹网进行投诉反馈,一经查实,立即删除!

相关文章

Redis.conf 配置文件解读

1、单位 容量单位不区分大小写,G和GB没有区别 配置文件 unit单位 对大小写不敏感 2、组合配置 可以使用 include 组合多个配置问题 3、网络配置 bind 127.0.0.1 # 绑定的ip protected-mode yes # 保护模式 port 6379 # 端口设置4、通用 GENERAL daemoniz…

Arm发布新的人工智能Cortex-M处理器

Arm发布了一款新的Cortex-M处理器,旨在为资源受限的物联网(IoT)设备提供先进的人工智能功能。这款新的Cortex-M52声称是最小的、面积和成本效率最高的处理器,采用了Arm Helium技术,使开发者能够在单一工具链上使用简化…

吉他学习:C大调第一把位音阶,四四拍曲目练习 小星星,练习的目的

第十三课 C大调第一把位音阶https://m.lizhiweike.com/lecture2/29364198 第十四课 四四拍曲目练习 小星星https://m.lizhiweike.com/lecture2/29364131 C大调第一把位音阶非常重要,可以多练习&#x

华为云ModelBox实战:体感小游戏应用实操

目录 一、VsCode插件注册ModelBox设备二、Windows SDK安装1.安装Git for Windows2.下载ModelBox SDK3.相关插件安装 三、体感小游戏应用开发1.技能模板使用2.AI应用示例3.体感小游戏体验 参与华为云活动【HCSD】ModelBox实战营邀请活动,呼朋唤友学AIoT,完…

《统计学简易速速上手小册》第9章:统计学在现代科技中的应用(2024 最新版)

文章目录 9.1 统计学与大数据9.1.1 基础知识9.1.2 主要案例:社交媒体情感分析9.1.3 拓展案例 1:电商销售预测9.1.4 拓展案例 2:实时交通流量分析 9.2 统计学在机器学习和人工智能中的应用9.2.1 基础知识9.2.2 主要案例:预测客户流…

单片机学习笔记---AT24C02(I2C总线)

目录 有关储存器的介绍 存储器的简介 存储器简化模型 AT24C02介绍 AT24C02引脚及应用电路 I2C总线介绍 I2C电路规范 开漏输出模式和弱上拉模式 其中一个设备的内部结构 I2C通信是怎么实现的 I2C时序结构 起始条件和终止条件 发送一个字节 接收一个字节 发送应答…

fast.ai 深度学习笔记(六)

深度学习 2:第 2 部分第 12 课 原文:medium.com/hiromi_suenaga/deep-learning-2-part-2-lesson-12-215dfbf04a94 译者:飞龙 协议:CC BY-NC-SA 4.0 来自 fast.ai 课程的个人笔记。随着我继续复习课程以“真正”理解它,…

今日早报 每日精选15条新闻简报 每天一分钟 知晓天下事 2月12日,星期一

每天一分钟,知晓天下事! 2024年2月12日 星期一 农历正月初三 1、 注意错峰出行!今起全国公路网流量将处于高位运行状态。 2、 中国旅游研究院:预计2024年国内旅游人数或超60亿人次。 3、 阔别四年,北京、贵阳、张家…

【深度优先搜索】【树】【图论】2973. 树中每个节点放置的金币数目

作者推荐 视频算法专题 本博文涉及知识点 深度优先搜索 树 图论 分类讨论 LeetCode2973. 树中每个节点放置的金币数目 给你一棵 n 个节点的 无向 树,节点编号为 0 到 n - 1 ,树的根节点在节点 0 处。同时给你一个长度为 n - 1 的二维整数数组 edges…

树莓派4B(Raspberry Pi 4B)使用docker搭建阿里巴巴sentinel服务

树莓派4B(Raspberry Pi 4B)使用docker搭建阿里巴巴sentinel服务 由于国内访问不了docker hub,而国内镜像仓库又没有适配树莓派ARM架构的sentinel镜像,所以我们只能退而求其次——自己动手构建镜像。本文基于Ubuntu,Jav…

WPF中值转换器的使用

什么是值转换器 在WPF(Windows Presentation Foundation)中,值转换器(Value Converter)是一种机制,允许你在绑定时转换绑定源和绑定目标之间的值。值转换器实现了 IValueConverter 接口,该接口…

在VSCode中创建Java项目

在VSCode中创建Java项目 首先,保证安装了Java的JDK. WinR -> 输入cmd -> 输入 java -version -> 然后可以看到安装的JDK版本,如果没安装可以去找教程。 JDK安装参考教程 打开VSCode,打开扩展(Ctrl Shift S&#xff…

《动手学深度学习(PyTorch版)》笔记8.6

注:书中对代码的讲解并不详细,本文对很多细节做了详细注释。另外,书上的源代码是在Jupyter Notebook上运行的,较为分散,本文将代码集中起来,并加以完善,全部用vscode在python 3.9.18下测试通过&…

网络安全工程师技能手册(附学习路线图)

关键词:网络安全入门、渗透测试学习、零基础学安全、网络安全学习路线 安全是互联网公司的生命,也是每位网民的基本需求。现在越来越多的人对网络安全感兴趣,愿意投奔到网络安全事业之中,这是一个很好的现象。 很多对网络安全感…

蓝牙 - BTSnoop File Format

1, Overview [ 概览 ] BTSnoop 文件格式适用于存储 Bluetooth HCI 通讯数据。它与 RFC 1761 中记录的 snoop 格式非常相似。 The BTSnoop file format is suitable for storing Bluetooth HCI traffic. It closely resembles the snoop format, as documented in RFC 1761. 2, …

flask+python企业产品订单管理系统938re

在设计中采用“自下而上”的思想,在创新型产品提前购模块实现了个人中心、个体管理、发布企业管理、投资企业管理、项目分类管理、产品项目管理、个体投资管理、企业投资管理、个体订单管理、企业订单管理、系统管理等的功能性进行操作。最终,对基本系统…

CRNN介绍:用于识别图中文本的深度学习模型

CRNN:用于识别图中文本的深度学习模型 CRNN介绍:用于识别图中文本的深度学习模型CRNN的结构组成部分工作原理 CRNN结构分析卷积层(Convolutional Layers)递归层(Recurrent Layers)转录层(Transc…

Unity Meta Quest MR 开发(四):使用 Scene API 和 Depth API 实现深度识别和环境遮挡

文章目录 📕教程说明📕Scene API 实现遮挡📕Scene API 实现遮挡的缺点📕Depth API 实现遮挡⭐导入 Depth API⭐修改环境配置⭐添加 EnvironmentDepthOcclusion 预制体⭐给物体替换遮挡 Shader⭐取消现实手部的遮挡效果 此教程相关…

vue常用9个事件修饰符

第075个 查看专栏目录: VUE ------ element UI 专栏目标 在vue和element UI联合技术栈的操控下,本专栏提供行之有效的源代码示例和信息点介绍,做到灵活运用。 提供vue2的一些基本操作:安装、引用,模板使用,computed&a…

备战蓝桥杯---搜索(进阶4)

话不多说,直接看题: 下面是分析: (ab)%c(a%cb%c)%c; (a*b)%c(a%c*b%c)%c; 因此,如果两个长度不一样的值%m为相同值,那就舍弃长的(因为再加1位只不过是原来值*10那位值,因此他们得出的%m还是同…