【Vue】Vuex概述

news2024/11/17 7:36:42

文章目录

  • 一、使用场景
  • 二、优势
  • 三、注意

官网:https://vuex.vuejs.org/zh/

Vuex 是一个 Vue 的 状态管理工具,状态就是数据。

工具可以直接理解成插件

大白话:Vuex 是一个插件,可以帮我们管理 Vue 通用的数据 (多组件共享的数据)。例如:购物车数据 个人信息数


一、使用场景

  • 某个状态 在 很多个组件 来使用 (个人信息)

  • 多个组件 共同维护 一份数据 (购物车)

总结就是:多组件共享的数据都可以往vuex丢

68317818664


二、优势

  • 共同维护一份数据,数据集中化管理
  • 响应式变化
  • 操作简洁 (vuex提供了一些辅助函数)

如下图,如果不使用VUEX,原本的数据传递如左图,紫色有一个数据,我将将来要给别人用,就需要子传父、父传子,即需要用到大量的组件通信,这样成本非常的高。

但是看右边,WITH VUEX,有了VUEX后紫球中通用的数据,直接存到我们的存库中,将来任何位置、任何页面组件中都可以直接拿来用,这样效率就非常高了。

68317829336

三、注意

官方原文:

  • 不是所有的场景都适用于vuex,只有在必要的时候才使用vuex
  • 使用了vuex之后,会附加更多的框架中的概念进来,增加了项目的复杂度 (但是数据的操作更便捷,数据的流动更清晰)

Vuex就像《近视眼镜》, 你自然会知道什么时候需要用它~

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

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

相关文章

信息学奥赛初赛天天练-26-CSP-J2023基础题攻略,组合数学、高精度算法、计算机存储奥秘与操作系统实践

PDF文档公众号回复关键字:20240611 单项选择题(共15题,每题2分,共计30分:每题有且仅有一个正确选项) 6 小明在某一天中依次有七个空闲时间段,他想要选出至少一个空闲时间段来练习唱歌,但他希…

NOSQL -- ES

第三个我们比较常用的NOSQL类型的数据库 --- ES 介绍: ES的全称(Elasticsearch) ES是一个分布式全文搜索的引擎 也就是我们平常在购物, 搜索东西的时候常用的, 就是一个ES的类型, 分布式全文搜索引擎 查询原理: 1>分词: 在查询之前, 其会将一些数据拆分开, 按照词进行拆分…

linux pxe和无人值守

一 PXE和无人值守 pxe c/s模式 允许客户端通过网络从远程服务器(服务端)下载引导镜像 加载安装文件 实现自动化安装操作系统 无人值守 就是安装选项不需要认为干预 可以自动化实现 pxe的优点 1 规模化 同时装配多台服务器 20多 30台 2 自动化 …

Mysql查询分析工具Explain的使用

一、前言 作为一名合格的开发人员,与数据库打交道是必不可少的,尤其是在业务规模和数据体量大规模增长的条件下,应用系统大部分请求读写比例在10:1左右,而且插入操作和一般的更新操作很少出现性能问题,遇到最多的&…

电子科技大学卓中卓二轮——分析笔记

1. 子系统的关键工作原理 在Linux子系统(Subsystem for Linux, 简称WSL)中,API(应用程序编程接口)的转换和映射是一个关键过程,目的是让Windows应用程序能够与Linux环境中的系统调用无缝交互。WSL使用了名…

【第2章】Vue快速上手

文章目录 前言一、第一个Vue程序二、Open in Browser插件1.安装2. 使用3. 界面 总结 前言 这里我们来实现我们的第一个程序。 一、第一个Vue程序 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><meta name&quo…

6月11号作业

思维导图 #include <iostream> using namespace std; class Animal { private:string name; public:Animal(){}Animal(string name):name(name){//cout << "Animal&#xff1b;有参" << endl;}virtual void perform(){cout << "讲解员的…

OpenCV多版本安装Ubuntu18.04

文章目录 一、查看已安装的Opencv版本二、安装新版本三、多版本OpenCV切换 OpenCV 官网 在此 一、查看已安装的Opencv版本 查看已安装opencv的版本 pkg-config opencv --modversion官网下载对应的版本&#xff0c;并解压 opencv3.4.3 二、安装新版本 进入前置准备里下载…

springSecurity学习笔记(一)

简介 Spring Security是一个Java框架&#xff0c;用于保护应用程序的安全性。它提供了一套全面的安全解决方案&#xff0c;包括身份验证、授权、防止攻击等功能。Spring Security基于过滤器链的概念&#xff0c;可以轻松地集成到任何基于Spring的应用程序中。它支持多种身份验…

高校运维赛 2024 easyshell

考点: 冰蝎流量解密部分明文攻击 看请求路由可以知道 shell.php是上传的马子 过滤器 http 加密返回包前16为完整base编码字符 一眼冰蝎流量解密 爆破aes常用密码 就是冰蝎默认aes密码 e45e329feb5d925b 冰蝎从开头流量都是连接初始化之类的,一般关键数据在后面 从后向前看发现…

电影推荐系统的设计

管理员账户功能包括&#xff1a;系统首页&#xff0c;个人中心&#xff0c;管理员管理&#xff0c;用户管理&#xff0c;免费电影管理&#xff0c;付费电影管理&#xff0c;电影论坛管理 前台账户功能包括&#xff1a;系统首页&#xff0c;个人中心&#xff0c;付费电影&#…

CMake的学习之路

目录 一、基础命令 二、编译选项和设置 三、文件和目录操作 四、控制流命令 五、其他命令 六、CMake构建级别 CMake是一个跨平台的自动化建构系统&#xff0c;它使用一种人类可读的配置文件&#xff08;CMakeLists.txt&#xff09;来控制软件编译过程。以下是CMake中的一些…

python-Numpy及Pandas数据分析应用

读取文件team.xlsx数据&#xff0c;其中name&#xff1a;名字, team&#xff1a;所属团队, Q1&#xff1a;语文分数, Q2&#xff1a;数学分数, Q3&#xff1a;英语分数, Q4&#xff1a;政治分数 # (1) 查询该数据的索引、所有值、列名、数据类型、元素个数、维度以及形状 imp…

【C++课程学习】:Data类的实现

&#x1f381;个人主页&#xff1a;我们的五年 &#x1f50d;系列专栏&#xff1a;C课程学习 &#x1f389;欢迎大家点赞&#x1f44d;评论&#x1f4dd;收藏⭐文章 目录 &#x1f369;1.头文件 &#x1f369;2.实现文件&#xff1a; &#x1f369;3.分析&#xff1a; &…

ARM32开发--PWM与通用定时器

知不足而奋进望远山而前行 目录 文章目录 前言 学习目标 学习内容 PWM pwm原理 需求 开发流程 初始化PWM PWM占空比控制 main函数修改duty 输出通道 关心的内容 重要的关键词 周期 分频 占空比 总结 前言 在微控制器开发中&#xff0c;理解和掌握PWM&#x…

计算机网络:网络层 - IPv4地址

计算机网络&#xff1a;网络层 - IPv4地址 分类编址划分子网子网掩码 无分类编址 CIDRCIDR 地址块构造超网 在酒店中&#xff0c;每个房间都有门牌号码&#xff0c;服务员送餐时&#xff0c;就可以根据门牌号码来判断一份餐要送到那个房间。 在网络中也是如此&#xff0c;一份…

泵制造5G智能工厂工业物联数字孪生可视化,推进制造业数字化转型

泵制造5G智能工厂工业物联数字孪生可视化&#xff0c;推进制造业数字化转型。泵制造行业&#xff0c;作为工业领域的核心部分&#xff0c;更是急需通过技术创新实现生产流程的智能化和高效化。而5G智能工厂工业物联数字孪生可视化技术的出现&#xff0c;为泵制造业的数字化转型…

【全网最齐报错的解决方法!】运行mvn命令打包项目jar包报错?“Fatal error compiling: 无效的目标发行版: 19 ”, 让我来看看~

最近写实验&#xff0c;要打包项目&#xff0c;但是不管是在cmd运行“mvn clean package -Dmaven.test.skiptrue”命令&#xff0c;还是在idea上去操作&#xff0c;都出现了这样的一个错误&#xff1a; [EROR] Failed to exeoute goal org.apache.maven.plugins:maven-comnpile…

作业6.11

练习1&#xff1a;输入一个数&#xff0c;判断是否是完美数 完美数&#xff1a;正序和逆序的结果一致 练习2&#xff1a; * ** *** **** for(int i0;i<4;i){for(int y1;y<4-i;y){ printf(" ");}for(int j0;j<i;j){printf("*&quo…

zabbix-agent如何版本回退降低?

文章目录 1&#xff0c;查看zabbix-agent版本号2&#xff0c;查看zabbix-server的版本号3&#xff0c;卸载已有的zabbix-agent4&#xff0c;找到与zabbix-server匹配版本的zabbix-agent5&#xff0c;安装zabbix-agent 5.0.42版本6&#xff0c;查看已安装的zabbix-agent的版本号…