uniApp 封装VUEX
Vuex Store (index.js)
import Vue from 'vue';
import Vuex from 'vuex';
import Cookies from 'js-cookie';Vue.use(Vuex);const saveStateKeys = ['vuex_user', 'vuex_token', 'vuex_demo'];const initialState = {vuex_user: { name: '用户信息' },vuex_token: Cookies.get('token') || '',vuex_isdev: false,vuex_version: '1.0.1',vuex_demo: '绛紫',vuex_testStore: '测试vuexStore',
};const store = new Vuex.Store({state: {...initialState,},mutations: {},actions: {dynamicAction(context, payload) {return new Promise((resolve, reject) => {context.commit(payload.type, payload.value).then(resolve).catch(reject);});},},
});// 动态生成 mutations 和 actions
const createMutation = (key) => (state, value) => {state[key] = value;saveLifeData(key, value);if (key === 'vuex_token') {Cookies.set('token', value);}
};const createAction = (key) => ({ commit }, value) =>new Promise((resolve, reject) => {commit(`SET_${key.toUpperCase()}`, value).then(resolve).catch(reject);});saveStateKeys.forEach(key => {store.commit(`ADD_MUTATION_${key.toUpperCase()}`, createMutation(key));store.commit(`ADD_ACTION_${key.toUpperCase()}`, createAction(key));
});function saveLifeData(key, value) {if (saveStateKeys.includes(key)) {let tmp = uni.getStorageSync('lifeData') || {};tmp[key] = value;uni.setStorageSync('lifeData', tmp);}
}export default store;
Mixin ($u.mixin.js)
import { mapState, mapActions } from 'vuex';
import store from '@/store';const $uStoreKey = Object.keys(store.state);const dynamicMapActions = (actionsObj) => {return Object.fromEntries(Object.entries(actionsObj).map(([actionName, action]) => [actionName,action.bind(null, store.dispatch),]));
};module.exports = {beforeCreate() {this.$u = {vuex: (name, value) => {if (value !== undefined) {this[`update${name.charAt(0).toUpperCase() + name.slice(1)}`](value);} else {return this[name];}},};},computed: {...mapState($uStoreKey.filter(key => key.startsWith('vuex_'))),},methods: {...dynamicMapActions({...store._modulesNamespaceMap['dynamic'].namespacedActions,}),},
};
使用示例
<template><div><h1>欢迎,{{ user.name }}!</h1><button @click="changeName">更改名字</button></div>
</template><script>
import uMixin from '@/mixins/u.mixin.js';export default {mixins: [uMixin],onShow() {this.$u.vuex('vuex_user', { name: '新用户' });console.log('初始用户信息:', this.$u.vuex('vuex_user'));},methods: {changeName() {this.$u.vuex('vuex_user', { name: '新用户' });},},
};
</script>
全局混入
import Vue from 'vue'
import store from '@/store';
// 引入uView提供的对vuex的简写法文件
let vuexStore = require('@/store/$u.mixin.js');
Vue.mixin(vuexStore);
const app = new Vue({store
})
app.$mount()相关文章:
uniApp 封装VUEX
Vuex Store (index.js) import Vue from vue; import Vuex from vuex; import Cookies from js-cookie;Vue.use(Vuex);const saveStateKeys [vuex_user, vuex_token, vuex_demo];const initialState {vuex_user: { name: 用户信息 },vuex_token: Cookies.get(token) || ,vue…...
最长公共子序列求长度和输出子序列C代码
求两个字符串的公共子序列我们都知道需要使用用动态规划思想 用res[i][j]表示截止到字符串A的第i个字符串和截止到字符串B的第j个字符的最长公共子序列。如两个字符串helloworld和loop,res[5][3]表示子串hello和子串loo的最长公共子序列,为lo࿰…...
安卓Framework开发快速分析日志及定位源码
文章目录 如何区分源码中 main system events 日志查看 Activity 生命周期日志分析 events 日志在源码中位置应用进程ID助分析具体应用ProtoLog 动态开关日志如何快速定位相关流程的代码位置 本文首发地址 https://h89.cn/archives/285.html 最新更新地址 https://gitee.com/ch…...
数据结构算法之B树
一、绪论 1.1 数据结构的概念和作用 1.2 B树的起源和应用领域 二、B树的基本原理 2.1 B树的定义和特点 2.2 B树的结构和节点组成 2.3 B树的插入 2.4 B树的删除操作 三、B树的优势和应用 3.1 B树在数据库系统中的应用 3.2 B树在文件系统中的应用 3.3 B树在内存管理中…...
【图卷积网络】GCN基础原理简单python实现
基础原理讲解 应用路径 卷积网络最经典的就是CNN,其 可以提取图片中的有效信息,而生活中存在大量拓扑结构的数据。图卷积网络主要特点就是在于其输入数据是图结构数据,即 G ( V , E ) G(V,E) G(V,E),其中V是节点,E是…...
【话题】AI是在帮助开发者还是取代他们
大家好,我是全栈小5,欢迎阅读小5的系列文章,这是《话题》系列文章 目录 引言AI在代码生成中的应用AI在错误检测和自动化测试中的作用对开发者职业前景的影响技能需求的变化与适应策略结论文章推荐 引言 随着人工智能(AIÿ…...
精通Perl正则表达式修饰符:提升文本处理能力的艺术
Perl语言以其强大的文本处理能力而闻名,其中正则表达式是其核心特性之一。正则表达式本身非常强大,但Perl提供的修饰符(Modifiers)进一步扩展了正则表达式的灵活性和表达能力。本文将深入探讨Perl中正则表达式修饰符的使用&#x…...
【web前端HTML+CSS+JS】--- HTML学习笔记01
学习链接:黑马程序员pink老师前端入门教程,零基础必看的h5(html5)css3移动端前端视频教程_哔哩哔哩_bilibili 学习文档: Web 开发技术 | MDN (mozilla.org) 一、前后端工作流程 WEB模型:前端用于采集和展示信息,中…...
Go 语言入门(一)
Go Modules依赖包查找机制 下载的第三方的依赖存储在 $GOPATH/pkg/mod 下go install 生成的可执行文件存储在 $GOPATH/bin下依赖查找顺序: 工作目录$GOPATH/pkg/mod$GOPATH/src 一、Go语言基础 1.标识符与关键字 1.1 命名方式 go变量、常量、自定义类型、包…...
爬虫笔记20——票星球抢票脚本的实现
以下内容仅供交流学习使用!!! 思路分析 前面的爬虫笔记一步一步走过来我们的技术水平也有了较大的提升了,现在我们来进行一下票星球抢票实战项目,实现票星球的自动抢票。 我们打开票星球的移动端页面,分…...
DDR3(三)
目录 1 预取1.1 什么是预取1.2 预取有哪些好处1.3 结构框图1.4 总结 2 突发2.1 什么是突发2.2 突发与预取 本文讲解DDR中常见的两个术语:预取和突发,对这两个概念理解的关键在于地址线的低位是否参与译码,具体内容请继续往下看。 1 预取 1.1…...
JDK都出到20多了,你还不会使用JDK8的Stream流写代码吗?
目录 前言 Stream流 是什么? 为什么要用Steam流 常见stream流使用案例 映射 map() & 集合 collect() 单字段映射 多字段映射 映射为其他的对象 映射为 Map 去重 distinct() 过滤 filter() Stream流的其他方法 使用Stream流的弊端 前言 当你某天看…...
QT slots 函数
文章目录 概述小结 概述 在Qt中,slots 是一种特殊的成员函数,它们可以与对象发出的信号连接。当信号被触发时,连接的槽函数会被调用。 来个简单的示例吧,如下图: #include <QObject> #include <QDebug>…...
pycharm如何使用jupyter
目录 配置jupyter新建jupyter文件别人写的方法(在pycharm种安装,在网页中使用) pycharm专业版 配置jupyter 在pycharm终端启动一个conda虚拟环境,输入 conda install jupyter会有很多前置包需要安装: 新建jupyter…...
机器学习——无监督学习(k-means算法)
1、K-Means聚类算法 K表示超参数个数,如分成几个类别,K值就取多少。若无需求,可使用网格搜索找到最佳的K。 步骤: 1、随机设置K个特征空间内的点作为初始聚类中心; 2、对于其他每个点计算到K个中心的距离,…...
强化学习-6 DDPG、PPO、SAC算法
文章目录 1 DPG方法2 DDPG算法3 DDPG算法的优缺点4 TD3算法4.1 双Q网络4.2 延迟更新4.3 噪声正则 5 附15.1 Ornstein-Uhlenbeck (OU) 噪声5.1.1 定义5.1.2 特性5.1.3 直观理解5.1.4 数学性质5.1.5 代码示例5.1.6 总结 6 重要性采样7 PPO算法8 附28.1 重要性采样方差计算8.1.1 公…...
vue3实现多表头列表el-table,拖拽,鼠标滑轮滚动条优化
需求背景解决效果index.vue 需求背景 需要实现多表头列表的用户体验优化 解决效果 index.vue <!--/** * author: liuk * date: 2024-07-03 * describe:**** 多表头列表 */--> <template><el-table ref"tableRef" height"calc(100% - 80px)&qu…...
Micron近期发布了32Gb DDR5 DRAM
Micron Technology近期发布了一项内存技术的重大突破——一款32Gb DDR5 DRAM芯片,这项创新不仅将存储容量翻倍,还显著提升了针对人工智能(AI)、机器学习(ML)、高性能计算(HPC)以及数…...
SQL Server时间转换
第一种:format --转化成年月日 select format( GETDATE(),yyyy-MM-dd) --转化年月日,时分秒,这里的HH指24小时的,hh是12小时的 select format( GETDATE(),yyyy-MM-dd HH:mm:ss) --转化成时分秒的,这里就不一样的&…...
kubernetes集群部署:node节点部署和CRI-O运行时安装(三)
关于CRI-O Kubernetes最初使用Docker作为默认的容器运行时。然而,随着Kubernetes的发展和OCI标准的确立,社区开始寻找更专门化的解决方案,以减少复杂性和提高性能。CRI-O的主要目标是提供一个轻量级的容器运行时,它可以直接运行O…...
2026搜索量暴涨!这几款配音软件火到刷屏
如果你最近刷短视频,一定注意到了——声音比画面更抓人。从悬疑解说的低沉旁白,到小说推文的多角色演绎,再到带货视频的情绪播报,一条爆款视频的背后,往往藏着一款好用的配音软件。2026年,AI配音市场迎来爆…...
28:L构建AI Agent安全:蓝队的智能代理防御
作者: HOS(安全风信子) 日期: 2026-03-19 主要来源平台: GitHub 摘要: AI Agent的发展为安全防御带来了新的可能性,但也带来了新的安全挑战。基拉等对手可能利用AI Agent进行攻击。L深入研究AI Agent安全技术ÿ…...
脉冲雷达系统仿真:从理论建模到Matlab代码实现
1. 脉冲雷达系统仿真入门指南 第一次接触雷达系统仿真时,我和大多数初学者一样,面对满屏的数学公式和专业术语完全摸不着头脑。直到把实验室那台老式示波器玩坏了三次之后,我才真正理解脉冲雷达仿真的核心逻辑——它本质上就是在计算机里搭建…...
终极Chrome全页截图指南:一键保存完整网页内容的高效方案
终极Chrome全页截图指南:一键保存完整网页内容的高效方案 【免费下载链接】full-page-screen-capture-chrome-extension One-click full page screen captures in Google Chrome 项目地址: https://gitcode.com/gh_mirrors/fu/full-page-screen-capture-chrome-ex…...
G-Helper高效解决ROG游戏本散热与性能平衡难题
G-Helper高效解决ROG游戏本散热与性能平衡难题 【免费下载链接】g-helper Lightweight Armoury Crate alternative for Asus laptops. Control tool for ROG Zephyrus G14, G15, G16, M16, Flow X13, Flow X16, TUF, Strix, Scar and other models 项目地址: https://gitcode…...
Wan2.1 VAE模型压缩实战:降低显存占用以适配更多GPU设备
Wan2.1 VAE模型压缩实战:降低显存占用以适配更多GPU设备 最近在尝试部署一些图像生成项目时,经常遇到一个头疼的问题:模型太大,显存不够用。特别是像Wan2.1 VAE这类模型,虽然生成效果出色,但动辄几个G的显…...
从锡膏印刷到炉温曲线:手把手调试你的第一条SMT生产线(避坑指南)
从锡膏印刷到炉温曲线:手把手调试你的第一条SMT生产线(避坑指南) 第一次接手SMT生产线调试时,我盯着那台二手贴片机的报警提示,手心全是汗。钢网上残留的锡膏像在嘲笑我的无知,而流水线上堆积的PCB板则不断…...
Debugging torch.distributed.DistBackendError: NCCL Communicator Setup and ncclUniqueId Retrieval Iss
1. 理解NCCL通信错误的核心问题 当你看到torch.distributed.DistBackendError: [2] is setting up NCCL communicator and retrieving ncclUniqueId这个错误时,本质上是在说GPU之间的"对讲机"无法正常建立连接。想象一下你正在组织一场多房间的线上会议&…...
SWF逆向工程行业报告:JPEXS Free Flash Decompiler市场份额2025深度分析
SWF逆向工程行业报告:JPEXS Free Flash Decompiler市场份额2025深度分析 【免费下载链接】jpexs-decompiler JPEXS Free Flash Decompiler 项目地址: https://gitcode.com/gh_mirrors/jp/jpexs-decompiler 在Flash技术逐渐退出主流但仍有大量历史资产需要维护…...
AT25SF041 SPI Flash驱动设计与嵌入式可靠性实践
1. AT25SF041 SPI Flash 存储器驱动深度解析AT25SF041 是由 Adesto(现为 Dialog Semiconductor)推出的 4 Mbit(512 KB)串行 NOR Flash 存储器,采用标准四线 SPI 接口(CLK、CS#、DI、DO)…...
