vue2 day6 7

1、vuex简介:共享数据 (数据在组件中传递 组件通信)
在这里插入图片描述

2、创建仓库
在这里插入图片描述
js中:this.$store 让我们可以在别的组件中访问仓库对象
在这里插入图片描述
3、state状态:提供公共数据(data只提供当前组件数据)
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
4、mutations(变化):修改state中的数据(仓库数据)
请添加图片描述请添加图片描述

所有mutation函数(mutations中所有函数),第一个参数都是state
请添加图片描述
mutations传参语法:
请添加图片描述
请添加图片描述
5、mapmutations:将mutations中方法映射到组件methods中(类似mapstate)请添加图片描述
6、getters:依赖于state中数据,响应式:state中数据变化,getters中函数结果值跟着变化
请添加图片描述
直接访问:
请添加图片描述
通过映射访问:
请添加图片描述
7、module模块:一个js文件一个模块,各模块维护自己的state、mutations、actions、getters等核心概念
请添加图片描述
调试工具中可以看到root下多了user和setting
请添加图片描述
模块中state访问语法:
。。。
8、json server
相当于mock接口

网址:https://www.npmjs.com/package/json-server
全局安装:本机项目可用
在这里插入图片描述

数组包对象格式:
在这里插入图片描述
请添加图片描述
启动服务:json-server --watch index.json

修改数量:提交请求给后端,一旦更新数据库成功,前端页面显示也要修改
重新刷新页面时,重新发送了请求,向后台请求数据,此时更新的数量是正确显示的,但我们需要做到不刷新页面,前端显示也正确 => 更新list(中某一个对象的count),list控制显示
在这里插入图片描述

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

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

相关文章

YOLOv9-Openvino和ONNXRuntime推理【CPU】

1 环境: CPU:i5-12500 Python:3.8.18 2 安装Openvino和ONNXRuntime 2.1 Openvino简介 Openvino是由Intel开发的专门用于优化和部署人工智能推理的半开源的工具包,主要用于对深度推理做优化。 Openvino内部集成了Opencv、Tens…

apachectl: line 79: 20233 Segmentation fault (core dumped) $HTTPD “$@“

[TOC](apachectl: line 79: 20233 Segmentation fault (core dumped) $HTTPD “$”) 1、问题描述 apache 启动报错 apachectl: line 79: 20233 Segmentation fault (core dumped) $HTTPD “$” 2、问题分析 参考链接: https://stackoverflow.com/questions/43726930/apache…

手机如何使用NFC卡模拟门禁刷卡

部分手机具备NFC卡刷卡功能,理论上也可模拟门禁卡。 一个功能强大且免费的NFC卡模拟器,可模拟各类门禁卡、电梯卡、部分公司(工厂)工卡或饭卡、部分学校饭卡、部分图书馆借书卡等各类IC卡,用手机替代卡片去刷门禁、刷…

petalinux烧写image.ub报错

xinlinx SDK烧写petalinux生成的BOOT.BIN和image.ub时,BOOT.BIN烧写正常,image.ub烧写报错如下 Erase Operation failed. INFO: [Xicom 50-44] Elapsed time 0 sec.ERROR: Flash Operation Failed串口助手操作擦除flash如图: 解决方法&am…

uniapp 使用安卓模拟器运行调试

uniapp 启动方式有很多种,这里介绍使用模拟器启动uniapp 要使用模拟器启动uniapp肯定少不了安装模拟器(废话) 这里选着浏览器推荐的第一个模拟器mumu模拟器 下载好了mumu安装包后就是安装了,这个过于小白,就不介绍了 2. 查看模拟器的adb端口号, mumu的adb查看端口号与众不同…

Chiplet技术与汽车芯片(一)

目录 1.摩尔定律放缓 2.Chiplet的优势 2.1 提升芯片良率、降本增效 2.2 设计灵活,降低设计成本 2.3 标准实行,构建生态 3.Chiplet如何上车 22年8月左右,Chiplet概念突然在二级市场火了起来,封测四小龙华天、长电、通富微电、…

Lua速成(2)

一、流程控制 Lua 编程语言流程控制语句通过程序设定一个或多个条件语句来设定。在条件为 true 时执行指定程序代码,在条件为 false 时执行其他指定代码。 控制结构的条件表达式结果可以是任何值,Lua认为false和nil为假,true和非nil为真。 …

深入探究Nginx的使用方法

目录 引言 一、网络状态页 二、Nginx 第三方模块 三、变量 (一)内置变量 (二)自定义变量 四、自定义日志 (一)有关日志的配置信息 (二)error日志的设置 1.日志的等级 2.自…

Coursera吴恩达机器学习专项课程02:Advanced Learning Algorithms 笔记 Week01

Advanced Learning Algorithms Week 01 笔者在2022年7月份取得这门课的证书,现在(2024年2月25日)才想起来将笔记发布到博客上。 Website: https://www.coursera.org/learn/advanced-learning-algorithms?specializationmachine-learning-in…

模板的初阶

目录 【本节目标】 1.泛型编程 2.函数模板 2.1函数模板概念 2.1 函数模板格式 2.3函数模板的原理 2.4函数模板的实例化 2.5模板参数的匹配原则 3.类模板 3.1类模板的定义格式 3.2类模板的实例化 【本节目标】 1. 泛型编程 2. 函数模板 3. 类模板 1.泛型编程 如何实现…

如何将简历项目部署到自己的域名下

通过上一篇文章我们得知如何在Github上Fork项目到自己账号下,还有学会配置好简历项目并部署上线,接下来我们就来看一下该项目是如何部署到自己的域名下的 👇 在项目文档中可以看到该简历项目是部署在Vercel上的,首先打开Vercel的官…

C++:list容器(非原生指针迭代器的实现)

本章是STL容器 list 的模拟实现。 之前已经使用 C语言 对带头双向循环链表 进行实现,详见数据结构: 线性表(带头双向循环链表实现), 相较于之前的实现,C 下多了对迭代器以及模板等相关语法特性。下面将着重讲解这些新知识。 文章目录 一. list 的基本框架…

2-22 方法、面向对象、类、JVM内存、构造方法

文章目录 方法的重载面向对象类、属性和方法成员变量默认值属性JVM简单内存分析栈空间堆空间 构造方法执行过程构造器注意点 方法的重载 一个类中名称相同,但是参数列表不同的方法 参数列表不同是指: 形参类型形参个数形参顺序 面向对象 field —— …

【GB28181】wvp-GB28181-pro部署安装教程(Ubuntu平台)

目录 前言1 安装依赖2 安装MySQL3 安装redis4 编译ZLMediaKit代码及依赖下载编译运行(如果要运行wvp整个项目,这步可以先不执行) 5 编译wvp-pro下载源码(建议从github上下载,gitee上维护有时候不是很同步)编…

嵌入式按键处理驱动(easy_button)

简介 在嵌入式裸机开发中,经常有按键的管理需求,GitHub上已经有蛮多成熟的按键驱动了,但是由于这样那样的问题,最终还是自己实现了一套。本项目地址:bobwenstudy/easy_button (github.com)。 项目开发过程中参考了如…

YOLOv9训练教程,并解决部分报错问题,必看❗❗❗

🥑 Welcome to Aedream同学 s blog! 🥑 文章目录 前言基本操作YAML文件解析注意事项❗❗❗gbk codec cant decode byte 0x80 in position 238: illegal multibyte sequencetrain.py, train_dual.py or train_triple.pyAttributeError: list object has n…

搭建Facebook直播网络对IP有要求吗?

在当今数字化时代,Facebook直播已经成为了一种极具吸引力的社交形式,为个人和企业提供了与观众直接互动的机会,成为推广产品、分享经验、建立品牌形象的重要途径。然而,对于许多人来说,搭建一个稳定、高质量的Facebook…

数字化转型与制造企业绿色创新质量——基于供需双侧机制的再检验(2011-2022年)

参照马红(2023)的做法,本团队对来自软科学《数字化转型与制造企业绿色创新质量—基于供需双侧机制的再检验》一文中的基准回归部分进行复刻 一、数据介绍 数据名称:数字化转型与制造企业绿色创新质量 参考期刊:《软…

主数据管理是数字化转型成功的基石——江淮汽车案例分享

汽车行业数字化转型的背景 在新冠疫情导火索的影响下,经济全球化政治基础逐渐动摇。作为全球最大的汽车市场,我国的汽车市场逐渐由增量转为存量市场。 在数字化改革大背景下,随着工业4.0时代的到来,江淮汽车集团力争实现十四五数…

【MATLAB】小波 MFE_SVM_LSTM 神经网络时序预测算法

有意向获取代码,请转文末观看代码获取方式~也可转原文链接获取~ 1 基本定义 小波MFE_SVM_LSTM神经网络时序预测算法是一种结合了小波变换、多尺度特征提取(MFE)、支持向量机(SVM)和长短期记忆神经网络(LST…