uniapp-商城-27-vuex 通用方法

1 概述

上节说了vuex 的基本使用方法,分析了基本的使用方法。

在使用中,常见使用,我们要针对状态,购物车,不同类事务的管理,如果按照上节课的通用方法,那么使用和维护是会很大的难度的。

所以这里就必须要进行处理,借助 modules  进行定义不同类事务的处理手段。便于后期维护和使用。

2 步骤

1、在store 中 建 一个文件夹  modules

2、在 modules 下对不同类事务建立JS文件

3、不同类的事务的JS 中创建对应的 state  mutations

state 就是该类事务需要的数据,数据的处理方法  mutations

4、定义:getters.js  将上面的3 中定义的  state  mutations 进行逻辑运算,并把计算好的结果---用变量的形式暴露---给外面的页面调用;

5、在store中 index 中 创建 getters和modules。

state在modules中的js文件中已经 分类创建了

6、在外面需要的页面和组件进行调用就ok

3 详细

第一步骤:在store 中 建 一个文件夹  modules

第二步骤:        在 modules 下对不同类事务建立JS文件

1 car.JS  包含state  mutations  还要导出cars

const cars = {//这里就没有modules了  因为这就是modulesstate: {//定义变量carsList: [],},mutations: {//定义动作 state 是上面定义的变量   num 是传进来的值setCarsList(state, itemNum) {if(itemNum==0) return state.carsList=[];let {item,num} = itemNum;let caritem = {goodsid: item.id || item.goodsid,   //注意数据来源  第一个是点击shop。vu

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

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

相关文章

半导体设备通信标准—secsgem v0.3.0版本使用说明文档(4)之HSMS(SEMI E37)

文章目录 1、消息快1.1、选择 请求1.2、选择响应1.3、取消选择请求1.4、取消选择响应1.5、Linktest 请求1.6、Linktest 响应1.7、拒绝请求1.8、单独请求1.9、数据消息 2、 协议2.1、 事件 SEMI E37 HSMS 定义主机和设备之间通过 TCP 协议的通信。 它指定用于启动和终止连接的数…

通过GO后端项目实践理解DDD架构

最近在工作过程中重构的项目要求使用DDD架构,在网上查询资料发现教程五花八门,并且大部分内容都是长篇的概念讲解,晦涩难懂,笔者看了一些github上入门的使用DDD的GO项目,并结合自己开发中的经验,谈谈自己对…

Ubuntu系统连网问题

0. Preface 给一台新电脑装上Ubuntu系统后,接好网线,发现上不了网,右上角是有网络连接的图标的,也能获取到ip地址,就是没办法连网,ping www.google.com也没反应。 其实应该是网络设置有点问题,…

C/C++---头文件保护机制

在 C 和 C 编程里,头文件保护机制是一种防止头文件被重复包含的技术,它主要借助 #ifndef、#define 和 #endif 这些预处理指令来达成,也可以使用 #pragma once 这一编译器特定指令。下面详细阐述这一机制: 1. 头文件重复包含的问题…

蓝桥杯 8. 分巧克力

分巧克力 原题目链接 问题描述 儿童节那天有 K 位小朋友到小明家做客。小明拿出了珍藏的巧克力招待小朋友们。 小明一共有 N 块巧克力,其中第 i 块是 Hᵢ Wᵢ 的长方形。为了公平起见,小明需要从这 N 块巧克力中切出 K 块巧克力分给小朋友们。 要求…

从 SQL2API 到 Text2API:开启数据应用开发的新征程

在技术革新浪潮的席卷下,数据应用开发领域正经历着深刻变革。曾经,构建数据 API 需要开发者具备扎实的数据库知识和编程技能,手动编写复杂的 SQL 查询与 API 代码,这一过程不仅耗时费力,还将众多非技术人员阻挡在数据应…

继承:(开始C++的进阶)

我们今天来学习C的进阶: 面向对象三大特性:封装,继承,多态。 封装我们在前面已经学了,我们细细理解,我们的类的封装,迭代器的封装(vector的迭代器可以是他的原生指针,li…

冒泡排序、插入排序、快速排序、堆排序、希尔排序、归并排序

目录 冒泡排序插入排序快速排序(未优化版本)快速排序(优化版本)堆排序希尔排序归并排序各排序时间消耗对比 冒泡排序 冒泡排序核心逻辑就是对数组从第一个位置开始进行遍历,如果发现该元素比下一个元素大,则交换位置,如果不大,就…

JavaScript:表单及正则表达式验证

今天我要介绍的是在JavaScript中关于表单验证内容的知识点介绍&#xff1a; 关于表单验证&#xff0c;我接下来则直接将内容以及效果显示出来并作注解&#xff0c;这样可以清晰看见这个表达验证的妙用&#xff1a; <form id"ff" action"https://www.baidu.…

天元证券|调仓曝光!首批科技基金一季报出炉

4月15日&#xff0c;中欧基金、永赢基金、长城基金等公募基金公司旗下部分权益类基金产品一季报出炉。 券商中国记者梳理发现&#xff0c;永赢信息产业智选混合主要聚焦信息技术领域布局&#xff0c;前十大重仓股中9只股票属于信息技术行业&#xff0c;合计占基金资产净值比例达…

SpringAI版本更新:向量数据库不可用的解决方案!

Spring AI 前两天&#xff08;4.10 日&#xff09;更新了 1.0.0-M7 版本后&#xff0c;原来的 SimpleVectorStore 内存级别的向量数据库就不能用了&#xff0c;Spring AI 将其全部源码删除了。 此时我们就需要一种成本更低的解决方案来解决这个问题&#xff0c;如何解决呢&…

Sklearn入门之datasets的基本用法

、 Sklearn全称:Scipy-toolkit Learn是 一个基于scipy实现的的开源机器学习库。它提供了大量的算法和工具&#xff0c;用于数据挖掘和数据分析&#xff0c;包括分类、回归、聚类等多种任务。本文我将带你了解并入门Sklearn下的datasets在机器学习中的基本用法。 获取方式 pi…

优化 Dockerfile 性能之实践(Practice of Optimizing Dockerfile Performance)

优化 Dockerfile 性能之实践 构建 Docker 镜像时&#xff0c;Dockerfile 的性能会显著影响构建过程的效率。经过优化的 Dockerfile 可以缩短构建时间、最小化镜像大小并提高整体容器性能。在本文中&#xff0c;我们将探讨优化 Dockerfile 性能的最佳实践。 尽量减少层数 影响…

出现 ERR_CERT_COMMON_NAME_INVALID | 301 302 重定向的解决方法

目录 前言1. 问题所示2. 原理分析3. 解决方法前言 🤟 找工作,来万码优才:👉 #小程序://万码优才/r6rqmzDaXpYkJZF 爬虫神器,无代码爬取,就来:bright.cn 1. 问题所示 执行代码时,出现如下提示: GET https://xxxx/admin-api/system

C语言 —— 指尖跃迁 刻印永恒 - 文件操作

目录 1. 什么是文件 1.1 程序文件 1.2 数据文件 1.3 文件名 2. 二进制文件和文本文件 3. 文件的打开与关闭 3.1 流和标准流 3.2 文件指针 3.3 文件的打开与关闭 fopen fclose 4. 文件的顺序读写 4.1 fgetc和fputc fgetc fputc 4.2 fgets和fputs fgets fputs…

用css给div列表加个序号

用 CSS 的 counter 相关属性来为列表添加序号。以下是具体的代码&#xff0c;我将以 HTML 文件的形式提供&#xff0c;并且会运行展示效果&#xff1a; .as-div {// counter-reset: my-counter; /* 计数器名称是my-counter */// counter-reset: small-apple; /* 计数器名称是s…

Rust : 关于*const () 与type erase

*const () 可以替代泛型&#xff0c;更加灵活。 一、 代码 //use std::mem::transmute; trait Work {fn process(&self); } struct Foo(String);impl Work for Foo {fn process(&self) {println!("process work from Foo : {}", self.0);} } struct Bar(S…

【专题刷题】双指针(二)

&#x1f4dd;前言说明&#xff1a; 本专栏主要记录本人的基础算法学习以及LeetCode刷题记录&#xff0c;按专题划分每题主要记录&#xff1a;&#xff08;1&#xff09;本人解法 本人屎山代码&#xff1b;&#xff08;2&#xff09;优质解法 优质代码&#xff1b;&#xff…

吉尔吉斯斯坦工商会代表团赴齐河德瑞新能源汽车考察

德州齐河&#xff0c;2025年4月15日电 时中美贸易突变之际&#xff0c;乘国家一带一路之风。 展中国新能源之宏图&#xff0c;塑国贸体系之新方向。 今日上午&#xff0c;吉尔吉斯斯坦共和国工商会代表团一行三人受邀抵达济南&#xff0c;开启对德瑞新能源科技有限公司&…

【记录condapack打包环境到超算上顺利运行】

以安装CLRNet为例子 本地Linux系统上的操作步骤。 由于官方的安装包的步骤&#xff0c;执行condapack的时候会报错&#xff0c;所以使用以下步骤进行安装包。 安装其他 Python 依赖包 pip install -r requirements.txt✅ 二、构建并打包项目&#xff08;核心步骤&#xff…