vue vuex 挂载_Vuex从使用到原理解析

一、Vuex是什么

Vuex是专门为Vuejs应用程序设计的状态管理工具。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。

1、Vuex的构成

由上图，我们可以看出Vuex有以下几个部分构成：

1)state

state是存储的单一状态，是存储的基本数据。

2)Getters

getters是store的计算属性，对state的加工，是派生出来的数据。就像computed计算属性一样，getter返回的值会根据它的依赖被缓存起来，且只有当它的依赖值发生改变才会被重新计算。

3)Mutations

mutations提交更改数据，使用store.commit方法更改state存储的状态。(mutations同步函数)

4)Actions

actions像一个装饰器，提交mutation，而不是直接变更状态。(actions可以包含任何异步操作)

5)Module

Module是store分割的模块，每个模块拥有自己的state、getters、mutations、actions。

const moduleA = {

state: { ... },

mutations: { ... },

actions: { ... },

getters: { ... }

}

const moduleB = {

state: { ... },

mutations: { ... },<