自定义全局变量在uniapp的Vuex应用

       本文介绍了uniapp使用自定义全局变量的方法。当同一业务在连续页面操作时,存在部分筛选变量需要始终保持一致,比如时间筛选条件等,来回跳转页面时如果采用变量传递,常较为繁琐,存在遗漏传递或未清除上一次变量值,造成错误。本文介绍了通过store本地缓存机制,实现全局变量的方法。

一、自定义全局变量设置文件businessGlobeVariable.js

@/store/modules/businessGlobeVariable

解释:

state:  自定义变量(本地缓存变量数据)

mutation: 数据修改

action:异步操作,调用mutation里的方法,从而修改state缓存数据

getters: 读取state数据


const businessGlobeVariable = {namespaced: true,state: {// 日常点检timeRangeTypeCheckDaily: '',// 周期巡视timeRangeTypeInspectionDaily: '',},mutations:{SET_TIME_RANGE_TYPE_CHECK_DAILY: (state, timeRangeTypeCheckDaily) => {state.timeRangeTypeCheckDaily = timeRangeTypeCheckDaily},SET_TIME_RANGE_TYPE_INSPECTION_DAILY: (state, timeRangeTypeInspectionDaily) => {debuggerstate.timeRangeTypeInspectionDaily = timeRangeTypeInspectionDaily},},actions:{SetTimeRangeTypeCheckDaily({ commit }, timeRangeTypeCheckDaily) {commit('SET_TIME_RANGE_TYPE_CHECK_DAILY', timeRangeTypeCheckDaily);},SetTimeRangeTypeInspectionDaily({ commit }, timeRangeTypeInspectionDaily) {debuggercommit('SET_TIME_RANGE_TYPE_INSPECTION_DAILY', timeRangeTypeInspectionDaily);},},getters: {timeRangeTypeCheckDaily: state => state.timeRangeTypeCheckDaily,timeRangeTypeInspectionDaily: state => state.timeRangeTypeInspectionDaily,}
}
export default businessGlobeVariable

二、缓存变量管理文件

@/store/index.js

import businessGlobeVariable from '@/store/modules/businessGlobeVariable'const store = new Vuex.Store({modules: {user,businessGlobeVariable},......})

三、使用

(1)设置全局变量

调用mutation方法并传参

this.$store.dispatch('businessGlobeVariable/SetTimeRangeTypeCheckDaily','lastThreeMonths')

(2)读取全局变量

Let e = this.$store.getters['businessGlobeVariable/timeRangeTypeCheckDaily']

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

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

相关文章

图像金字塔的作用

1. 概述 图像金字塔是图像多尺度表达的一种,主要应用与图像分割,是一种以多分辨率来解释图像的有效但概念简单的结构。图像金字塔实际上是一张图片在不同尺度下的集合,即原图的上采样和下采样集合。金字塔的底部是高分辨率图像,而…

LuaJit分析(九)LuaJit中的JIT原理分析

Jit in luajit Luajit是一款高性能的lua解释器,与官方的lua解释器相比,luajit的高速除了将解释器直接以汇编代码实现外,还支持jit模式(Just in time)。Jit模式即将luajit的字节码编译成处理器能够直接执行的机器码&am…

vue3如何监听reactive对象是哪个属性发生的变化

在 Vue 3 中,如果你想监听 reactive 对象中的某个属性发生的变化,你可以使用 watch 函数进行监听。watch 函数允许你观察 reactive 对象的某个属性或者整个对象,并在变化时执行相应的操作。 1. 监听 reactive 对象的某个属性 如果你只想监听…

C++学习/复习补充记录 --- 图论(深搜,广搜)

数据结构与算法 | 深搜(DFS)与广搜(BFS)_深搜广搜算法-CSDN博客 深度优先搜索理论基础 深搜和广搜的区别: (通俗版) dfs是可一个方向去搜,不到黄河不回头,直到遇到绝境了…

在Unity中使用C#进行Xml序列化时保留特定小数位的方法参考

序列化方法代码参考&#xff1a; using System.IO; using System.Xml.Serialization;public class XmlTool {public static string ToXml<T>(T obj){XmlSerializer xmlSerializer new XmlSerializer(typeof(T));using var stringWriter new StringWriter();//让xml文档…

linux驱动 -- 输入子系统

1:输入子系统介绍 一个统一的输入设备的开发框架&#xff0c; 统一生成设备文件&#xff0c; 统一返回固定格式值。 2:输入子系统开发设备 键盘、鼠标、触摸屏等等。 3&#xff1a;输入子系统运行框架 应用层&#xff1a;操作设备文件openclosereadwrite 输入子系统&#xff…

Netty 学习笔记

Java 网络编程 早期的 Java API 只支持由本地系统套接字库提供的所谓的阻塞函数&#xff0c;下面的代码展示了一个使用传统 Java API 的服务器代码的普通示例 // 创建一个 ServerSocket 用以监听指定端口上的连接请求 ServerSocket serverSocket new ServerSocket(5000); //…

OS常规测试方法-PPMU

step 0: 检查工作&#xff1a; 检查每根pin连接到指定的PPMU资源是否正确继电器资源在PRJ文件中是否定义正确 step 1 设计者设计的测试电路继电器重置初始化close应该闭合的继电器 step 2 DPS pin电压置0V&#xff0c;同时考虑电流量程wait闭合测试机DPS通道RELAYwait st…

android13 隐藏状态栏里面的飞行模式 隐藏蓝牙 隐藏网络

总纲 android13 rom 开发总纲说明 目录 1.前言 2.问题分析 3.代码分析 4.代码修改 5.编译运行 6.彩蛋 1.前言 android13 隐藏状态栏里面的飞行模式,或者其他功能,如网络,蓝牙等等功能,隐藏下图中的一些图标。 2.问题分析 这里如果直接找这个布局的话,需要跟的逻…

nefu暑假acm集训1 构造矩阵 个人模板+例题汇总

前言&#xff1a; 以下都是nefu暑假集训的训练题&#xff0c;我在此把我的模板和写的一些练习题汇总一下并分享出来&#xff0c;希望在能满足我复习的情况下能帮助到你。 正文&#xff1a; 模板&#xff1a; #include<bits/stdc.h> using namespace std; typedef long…

算法训练营|图论第5天

题目&#xff1a;107.寻找存在的路径 题目链接&#xff1a; 107. 寻找存在的路径 (kamacoder.com) 代码&#xff1a; #include<bits/stdc.h> #include<unordered_map> #include<unordered_set> using namespace std; vector<int>father; int find(…

Celery 中,广播模式可以通过使用 RabbitMQ 的 fanout 交换机来实现

这里写自定义目录标题 设置 Django 的 settings 模块从 Django 的 settings 文件中加载 Celery 配置自动发现任务使 Celery 实例可用配置 Celery 的任务路由 在 Celery 中&#xff0c;广播模式可以通过使用 RabbitMQ 的 fanout 交换机来实现。fanout 交换机会将消息广播到所有绑…

嵌入式开发者必备资料库 【完全免费】

嵌入式资料网盘分享文案 &#x1f31f; 嵌入式开发者必备资料库 &#x1f31f; 亲爱的嵌入式开发爱好者们&#xff0c; 我们为大家准备了一份丰富的嵌入式资料网盘&#xff0c;涵盖了单片机、Linux系统、硬件设计等多个领域的优质资源&#xff0c;助力你的学习和项目开发&…

国外课程环境总结

CS106L2023 and CS106B 环境配置(详细教程)_cs106b 2023-CSDN博客

Java:内存过高和CPU过高的排查流程

一、CPU占用过高排查流程 1、利用 top 命令可以查出占 CPU 最高的的进程pid 。 假设pid为 98762、查看该进程下占用最高的线程id。 top -Hp 98763、假设占用率最高的线程 ID 为 6900&#xff0c;将其转换为 16 进制形式 (因为 java native 线程以16进制形式输出) 。 printf…

WHAT - 通过 react-use 源码学习 React(State 篇)

目录 一、官方介绍1. Sensors2. UI3. Animations4. Side-Effects5. Lifecycles6. State7. Miscellaneous 二、源码学习示例&#xff1a;n. xx - yyState - createMemoState - createReducer 一、官方介绍 Github 地址 react-use 是一个流行的 React 自定义 Hook 库&#xff0…

Qt 学习第7天:Qt核心特性

元对象系统Meta-object system 来自AI生成&#xff1a; Qt中的元对象系统&#xff08;Meta-Object System&#xff09;是Qt框架的一个核心特性&#xff0c;它为Qt提供了一种在运行时处理对象和类型信息的能力。元对象系统主要基于以下几个关键概念&#xff1a; 1. QObject&a…

Linux实现异步IO的方法:epoll,posix aio,libaio,io_uring

Linux中异步IO的实现方式大概有以下几种&#xff1a; 1. epoll 熟悉网络编程的人可能会想到select&#xff0c;poll&#xff0c;epoll这些异步IO的方式&#xff0c;但实际上这些方式叫做非阻塞IO&#xff0c;并不是实际意义上的异步IO。因此这些只能用于异步的Socket IO&…

有了豆包Marscode你还害怕不会写代码吗?

前言 随着科技的飞速发展&#xff0c;软件开发者们正面临着前所未有的挑战。编程任务变得越来越复杂&#xff0c;他们不仅需要编写和维护大量的代码&#xff0c;还要在严格保证代码质量的同时&#xff0c;提高开发效率。在这种背景下&#xff0c;一款高效且实用的辅助编码工具…

Depth anything v2环境相关问题

环境配置&#xff1a;numpy版本 2.x的版本不兼容。 因为我的torch版本较高&#xff0c;所以numpy改成一个较高的版本&#xff1a;1.26.4。可用 warning&#xff1a;xFormers not available xFormers: 一个用于推理加速的库&#xff0c;尤其是当输入尺寸增大时&#xff0c;能…