标签：状态 大白话 更改 state 理解 mutation Vuex store

大白话理解Vuex

原文：https://mp.weixin.qq.com/s/askQxPHeKA-yyNAbwYYTvQ

几个关键字段的含义

1. vuex是什么？

Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态。

白话：vuex就是帮我们存储一下多个组件共享的数据，方便我们对其读取和更改。

2. State

官方解释：Vuex使用单一状态树，用一个对象就包含了全部的应用层次状态。它便作为一个唯一的数据源而存在。这也就意味着， 每个应用将仅仅包含一个store实例。

白话：组件中所要共享的数据，我们就会抽取一个store，而state即是我们可以共享的数据。

3. Mutations

更改Vuex的store中的状态的唯一方法是提交mutation。

Vuex中的mutation非常类似于事件：每个mutation都有一个字符串的事件类型和一个回调函数。

这个回调函数就是我们实际进行状态更改的地方。并且它会接受state第一个参数。

白话：可以理解为更改state的唯一途径就是mutation（同步）

4. Actions

类似于Mutation，不同在于：

• Action提交的是mutation，而不是直接更改状态
• Action可以包含任意一步操作

白话：Actions也可以更改state，但是是通过commit，提交到mutation，不直接更改（异步）

5. Getters

Vuex 允许我们在 store 中定义getter（可以认为是 store 的计算属性）。

就像计算属性 computed 一样，getter 的返回值会根据它的依赖被缓存起来。

且只有当它的依赖值发生了改变才会被重新计算。

6. mapState

是一个辅助函数，当一个组件需要获取多个状态时候，将这些状态都声明为计算属性会有些重复和冗余。

为了解决这个问题，我们可以使用 mapState 辅助函数帮助我们生成计算属性。

白话：即帮我们获取对应的state值

7. mapAction

是一个辅助函数，个人觉得比 dispatch 使用起来方便，主要是创建组件方法分发action,推荐使用。

标签：状态,大白话,更改,state,理解,mutation,Vuex,store
来源： https://www.cnblogs.com/konglxblog/p/15203546.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。