uniapp 使用 pinia 状态持久化

1.创建文件

stores
-index.js
-global.js

2.对应文件内容 index.js
安装插件 npm i pinia-plugin-persistedstate

import { createPinia } from 'pinia';
import persist from 'pinia-plugin-persistedstate';
const pinia = createPinia();
pinia.use(persist);
export default pinia;

3.对应文件内容 global.js

import { defineStore } from 'pinia';
import { ref,reactive } from "vue";export const useGlobalStore = defineStore('global', () => {const tabBarStatus = ref('1');const system = ref({})const changeTabBarStatus = (status) => {tabBarStatus.value = status; // 示例:改变 tabBarStatus 的值};const setSystem=(options)=>{system.value=options;}const getSystem=()=>{return system.value;}return { tabBarStatus, system,changeTabBarStatus,setSystem,getSystem};
},
{// 网页端配置// persisit:true,// 小程序端  修改其设置 获取方法persist:{storage:{getItem(key){return uni.getStorageSync(key);},setItem(key,value){uni.setStorageSync(key,value);}}}});

4.注册到main.js中

import App from './App'
// #ifndef VUE3
import Vue from 'vue'
import './uni.promisify.adaptor'
Vue.config.productionTip = false
App.mpType = 'app'
const app = new Vue({...App
})
app.$mount()
// #endif// #ifdef VUE3
import { createSSRApp } from 'vue'
import pinia from '@/stores/index'
export function createApp() {const app = createSSRApp(App)app.use(pinia);return {app}
}
// #endif

如果想在utils 下的工具中使用可以使用一下写法

import pinia from '@/stores/index.js'
import { useGlobalStore } from "@/stores/global";
const globalStore = useGlobalStore(pinia)
export default {getUploadImageDomainName(){return  globalStore.system.img_host;}
}

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

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

相关文章

代码随想录算法训练营第3天(链表1)| 203.移除链表元素 707.设计链表 206.反转链表

一、203.移除链表元素 题目:203. 移除链表元素 - 力扣(LeetCode) 视频:手把手带你学会操作链表 | LeetCode:203.移除链表元素_哔哩哔哩_bilibili 讲解:代码随想录 注意: 针对头结点和非头结点的…

CES Asia 2025科技盛宴,AI智能体成焦点

2025第七届亚洲消费电子技术展(CES Asia赛逸展)将在北京拉开帷幕,AI智能体有望成为展会的核心亮点。 深圳市人工智能行业协会发文表示全力支持CES Asia 2025(赛逸展),称其为人工智能领域的创新发展提供了强…

matlab编写分段Hermite插值多项式

文章目录 原理使用分段Hermite插值多项式原因公式第一类的两个插值积函数第二类的两个插值积函数 例题法一法二 代码分段 Hermite 插值的思路:分段 Hermite 插值多项式的构造:MATLAB 实现代码:结果如图:注归一化变量的作用&#x…

Cline(原Claude Dev)开源的IDE AI插件,如何搭配OpenRouter实现cursor功能,Cline怎么使用

Cline(原Claude Dev)是一个开源的IDE AI插件,可以使用你的命令行界面和编辑器的人工智能助手。 你可以直接在VS Code编辑器进行安装。如果你使用过Cursor AI IDE的话,可以尝试最新发布的Cline3.1版本。 在OpenRouter上&#xff0…

计科高可用服务器架构实训(防火墙、双机热备,VRRP、MSTP、DHCP、OSPF)

一、项目介绍 需求分析: (1)总部和分部要求网络拓扑简单,方便维护,网络有扩展和冗余性; (2)总部分财务部,人事部,工程部,技术部,提供…

企业级PHP异步RabbitMQ协程版客户端 2.0 正式发布

概述 workerman/rabbitmq 是一个异步RabbitMQ客户端,使用AMQP协议。 RabbitMQ是一个基于AMQP(高级消息队列协议)实现的开源消息组件,它主要用于在分布式系统中存储和转发消息。RabbitMQ由高性能、高可用以及高扩展性出名的Erlan…

AsyncOperation.allowSceneActivation导致异步加载卡死

先看这段代码,有个诡异的问题,不确定是不是bug public class Test : MonoBehaviour {void Start(){StartCoroutine(LoadScene(Ego.LoadingLevel));}IEnumerator LoadScene(string sceneName){LoadingUI.UpdateProgress(0.9f);yield return new WaitForS…

C#使用MVC框架创建WebApi服务接口

第一步,使用VS2019新建MVC-Web API应用程序 创建BridgeApi 第二步,运行将生成默认的示例网页,网页Url为 https://localhost:44361/home/index 右键 项目 添加 WebAPI控制器类 添加 我们可以看到App_Start目录下 有三个文件: BundleConfig.cs代表 捆绑文件的引用 有脚本文件…

hive迁移后修复分区慢,怎么办?

我有1个30TB的分区表,客户给的带宽只有600MB,按照150%的耗时来算,大概要迁移17小时。 使用hive自带的修复分区命令(一般修复分区比迁移时间长一点),可能要花24小时。于是打算用前面黄大佬的牛B方案。 Hive增…

慧集通(DataLinkX)iPaaS集成平台-业务建模之业务对象(一)

通过左侧导航菜单〖业务建模〗→〖业务对象〗,进入该界面;在该界面可以查看到系统中已存在的业务对象; 1.新建业务对象 在DatalinkX中进入【业务建模】的【业务对象】页面,点击【新建】按钮进入新建页面; 新建页面左侧…

Linux系统之hostname相关命令基本使用

Linux系统之hostname相关命令基本使用 一、检查本地系统版本二、hostname命令的帮助说明中文帮助说明 三、hostname命令的基本使用1. 查看计算机名2. 查看本机上所有IP地址3. 查看主机FQDN4. 查看短主机名 四、hostnamectl命令的使用1. 查看主机详细信息2. 设置主机名3. hostna…

DC系列靶场渗透--DC-3

目录 环境搭建 开始渗透 扫存活 扫端口 扫服务 查看80端口 尝试在80端口中的登陆页面寻找sql注入失败 扫目录 进入/htaccess.txt目录看一下 我们尝试找一下Joomla3.7.0版本的漏洞 我们尝试利用该漏洞 查数据库名 查表名 查列名 查数据 找到密码的可能的编码方式…

js代理模式

允许在不改变原始对象的情况下,通过代理对象来访问原始对象。代理对象可以在访问原始对象之前或之后,添加一些额外的逻辑或功能。 科学上网过程 一般情况下,在访问国外的网站,会显示无法访问 因为在dns解析过程,这些ip被禁止解析,所以显示无法访问 引…

uniapp 之 uni-forms校验提示【提交的字段[‘xxx‘]在数据库中并不存在】解决方案

目录 场景问题代码结果问题剖析解决方案 场景 uni-forms官方组件地址 使用uniapp官方提供的组件,某个表单需求,单位性质字段如果是高校,那么工作单位则是高校的下拉选择格式,单位性质如果是其他的类型,工作单位则是手动…

深度学习知识点:RNN

文章目录 1.简单介绍2.网络结构3.应对梯度消失 1.简单介绍 循环神经网络(RNN,Recurrent Neural Network)是一类用于处理序列数据的神经网络。与传统网络相比,变化不是特别大,不如CNN的变化那么大。 为什么要有循环神经…

(leetcode算法题)287. 寻找重复数(经典题目,二分解法)

如果一个题目限定了数据范围是[1, n]内的整数,那么这个题目可以思考的就是 nums[i]和 i 的关系,769. 最多能完成排序的块 这个题就使用到了子数组中最大值和 连续[0, n - 1]的关系 而对于本题来说,也可以思考[1, n] 和 nums[i] 的关系&…

4.1、二纤单向、二纤双向、四纤双向,网络级保护

1、线性复用段保护(LMSP) 就像是给网络业务传输准备的一个 “保险”。在 SDH 和 MSTP 网络里,业务信号要通过一段一段的路(复用段)来传输,LMSP 就是为了保证这些路出问题的时候,业务还能正常走。…

【数据库】一、数据库系统概述

文章目录 一、数据库系统概述1 基本概念2 现实世界的信息化过程3 数据库系统内部体系结构4 数据库系统外部体系结构5 数据管理方式 一、数据库系统概述 1 基本概念 数据:描述事物的符号记录 数据库(DB):长期存储在计算机内的、…

【JVM-2.1】如何使用JMC监控工具:详细步骤与实战指南

Java Mission Control(JMC)是Oracle提供的一个高级图形化监控工具,专为Java应用程序的性能分析和故障排查设计。JMC不仅提供了实时监控功能,还支持飞行记录器(Flight Recorder)功能,能够记录JVM…

QT c++ 样式 设置 标签(QLabel)的渐变色美化

上一篇文章中描述了按钮的纯色&#xff0c;本文描述标签的渐变色美化。 1.头文件 #ifndef WIDGET_H #define WIDGET_H #include <QWidget> //#include "CustomButton.h"#include <QVBoxLayout> #include <QLinearGradient> #include <QLabel…