前端学习——vuex的入门

学习一门技术最快捷的方式就是先了解其概念和使用场景,毕竟任何技术的出现都是为了解决某一个场景下的通用解决方案,并且使用最合理的方式去解决问题。

那么什么是vuex?

Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式 + 库。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。

这是vuex官网给的关于vuex的概念,翻译成白话就是一个状态(数据)管理的库,类似于数据库。

其产生的场景是解决vue组件之间的数据共享问题,因为每个组件都有其自身需要操作的数据,比如用户组件需要操作用户数据,订单组件需要操作订单数据,但不同组件之间有可能会涉及到一些公共到数据,比如用户组件和订单组件都需要用到用户的唯一标识。

这时如果每个组件都维护一份用户唯一标识的数据虽然也可以,但会出现大量的重复数据和重复代码,不符合组件开发的思想。

所以,vue就提供了一个统一组件数据管理的工具,就是vuex,其功能就类似于一个数据库,在vue的组件开发中,把一些通用的数据操作统一使用vuex进行管理,比如后端开发中就把数据全部放在数据库中,业务逻辑根据不同的场景去调用数据库获取数据。

如下图所示,app是一个vue项目,里面有多个组件模块A,B,C,D,而vuex是独立于app模块的一个独立功能,里面保存的就是各个组件中需要使用的数据。

 怎么使用vuex 

使用vuex 需要先使用npm 安装vuex 并且在vue对象中使用Vue.use(vuex).以下是vuex官网提供的vuex 的运行逻辑图

创建vuex.store 创建vuex实例:

在main.js中,把vuex的store 和 vue对象进行绑定。效果如下图:

这时就可以像调用其他vue对象属性一样,调用store仓库。

this.$store.dispatch/commit/等。

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

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

相关文章

基于ssm+jsp学生综合测评管理系统源码和论文

网络的广泛应用给生活带来了十分的便利。所以把学生综合测评管理与现在网络相结合,利用java技术建设学生综合测评管理系统,实现学生综合测评的信息化。则对于进一步提高学生综合测评管理发展,丰富学生综合测评管理经验能起到不少的促进作用。…

OPC UA 与PROFINET比较

ROFINET和OPC UA是两种常见的协议,过去这两个协议有两个不同的角色。PROFINET通常用于现场设备和本地控制器之间的实时数据通信。而OPC UA通常用于在本地控制器和更高级别的MES和SCADA系统之间进行通信。 OPC UA 网络架构 PROFINET网络由IO控制器和IO设备组成&…

【数据结构】什么是树?

🦄个人主页:修修修也 🎏所属专栏:数据结构 ⚙️操作环境:Visual Studio 2022 📌树的定义 树(Tree)是n(n≥0)个结点的有限集.n0时称为空树. 在任意一颗非空树中: 有且仅有一个特定的称为根(Root)的结点;当n>1时,其余结点可分为m(m>0)个互…

Laravel框架使用phpstudy本地安装的composer用Laravel 安装器进行安装搭建

一、首先需要安装Laravel 安装器 composer global require laravel/installer 二、安装器安装好后,可以使用如下命令创建项目 laravel new sys 三、本地运行 php artisan serve 四、 使用Composer快速安装Laravel5.8框架 安装指定版本的最新版本(推荐&a…

怎样写一个C语言程序计算以下问题?

怎样写一个C语言程序计算以下问题? 在开始前我有一些资料,是我根据自己从业十年经验,熬夜搞了几个通宵,精心整理了一份「C语言的资料从专业入门到高级教程工具包」,点个关注,全部无偿共享给大家&#xff01…

Python 将RTF文件转为Word 、PDF、HTML

RTF也称富文本格式,是一种具有良好兼容性的文档格式,可以在不同的操作系统和应用程序之间进行交换和共享。有时出于不同项目的需求,我们可能需要将RTF文件转为其他格式。本文将介如何通过简单的Python代码将RTF文件转换为Word Doc/Docx、PDF、…

MySQL数据库基础和基本的增删改查操作

目录 前瞻 数据库的基本概念 数据库管理系统(DBMS) 数据库系统(DBS) 数据库类型和常用数据库 关系型数据库 SQL 非关系型数据库 NoSQL SQL语句 简介 SQL语句分类 常用的数据类型 MySQL的六大约束特性 SQL语句的使用 创建及删除数据库和表 …

【小白专用】php以pdo方式连接sqlserver,开启sqlsrv扩展

一、安装ODBC程序, 下载适用于 SQL Server 的 ODBC 驱动程序 - 适用于 SQL Server 的 ODBC 驱动程序 |Microsoft 学习 运行安装程序,出现如下图所示页面; 选择下一步;选择我同意许可协议中的条款后选择下一步; 点击安…

c语言易错题之数据类型变换

1.题目 #include<stdio.h> int main() {int arr[]{1,2,3,4,5};short*p (short*)arr;int i 0;for(i0;i<4;i){*(pi)0;}for(i0;i<5;i){printf("%d ",arr[i];}return 0; }2.解析 这道题主要容易错在&#xff0c;大家会以为通过指针赋值的时候&#xff0c;…

初级数据结构(七)——二叉树

文中代码源文件已上传&#xff1a;数据结构源码 <-上一篇 初级数据结构&#xff08;六&#xff09;——堆 | NULL 下一篇-> 1、写在前面 二叉树的基本概念在《初级数据结构&#xff08;五&#xff09;——树和二叉树的概念》中已经介绍得足够详细了。上一…

AcWing算法提高课-1.4.2股票买卖 IV

算法提高课整理 CSDN个人主页&#xff1a;更好的阅读体验 原题链接 题目描述 给定一个长度为 n n n 的数组&#xff0c;数组中的第 i i i 个数字表示一个给定股票在第 i i i 天的价格。 设计一个算法来计算你所能获取的最大利润&#xff0c;你最多可以完成 k k k 笔交易…

【工具使用-有道云笔记】如何在有道云笔记中插入目录

一&#xff0c;简介 本文主要介绍如何在有道云笔记中插入目录&#xff0c;方便后续笔记的查看&#xff0c;供参考。 二&#xff0c;具体步骤 分为两个步骤&#xff1a;1&#xff0c;设置标题格式&#xff1b;2&#xff0c;插入标题。非常简单~ 2.1 设置标题格式 鼠标停在标…

论文阅读——Flamingo

Flamingo: a Visual Language Model for Few-Shot Learning 模型建模了给定交织的图片或支视频的条件下文本y的最大似然&#xff1a; 1 Visual processing and the Perceiver Resampler Vision Encoder&#xff1a;from pixels to features。 预训练并且冻结的NFNet&#xff…

C++的面向对象学习(4):对象的重要特性:构造函数与析构函数

文章目录 前言&#xff1a;将定义的类放在不同文件夹供主文件调用的方法一、构造函数与析构函数1.什么是构造函数和析构函数&#xff1f;2.构造函数和析构函数的语法3.构造函数的具体分类和调用方法①总的来说&#xff0c;构造函数分类为&#xff1a;默认无参构造、有参构造、拷…

【RocketMQ每日一问】rocketmq事务消息原理?

rocketmq事务消息原理&#xff1f; RocketMQ的事务消息主要由三部分组成&#xff1a;半消息&#xff08;Half Message&#xff09;、执行本地事务和事务补偿机制。下面详细介绍这三部分&#xff1a; 半消息&#xff08;Half Message&#xff09;用户向RocketMQ发送半消息&…

多臂老虎机算法步骤

内容导航 类别内容导航机器学习机器学习算法应用场景与评价指标机器学习算法—分类机器学习算法—回归机器学习算法—聚类机器学习算法—异常检测机器学习算法—时间序列数据可视化数据可视化—折线图数据可视化—箱线图数据可视化—柱状图数据可视化—饼图、环形图、雷达图统…

antdv中的slider组件会默认将min值传递给value

如果是使用响应式变量&#xff0c;会将min的值传递到v-model对应的变量里

最大化控制资源成本 - 华为OD统一考试

OD统一考试 题解: Java / Python / C++ 题目描述 公司创新实验室正在研究如何最小化资源成本,最大化资源利用率,请你设计算法帮他们解决一个任务分布问题:有taskNum项任务,每人任务有开始时间(startTime) ,结更时间(endTme) 并行度(paralelism) 三个属性,并行度是指这个…

vivado 主时钟分析

主时钟 主时钟是通过输入端口或千兆位进入设计的板时钟收发器输出引脚&#xff08;例如恢复的时钟&#xff09;。主时钟只能由create_clock命令定义。主时钟必须附加到网表对象。此网表对象表示中的点所有时钟边沿源自其并在时钟树上向下游传播的设计。换句话说&#xff0c;主…

Android Realm数据库使用

当我们的app有数据需要保存到本地缓存时&#xff0c;可以使用file&#xff0c;sharedpreferences&#xff0c;还有sqlite。 sharedpreferences其实使用xml的方式&#xff0c;以键值对形式存储基本数据类型的数据。对于有复杂筛选查询的操作&#xff0c;file和sharedpreference…