vuex介绍

vuex介绍：

1、Vue有著名的全家桶系列，包含了vue-router，vuex， vue-resource。再加上构建工具vue-cli，sass样式,就是一个完整的vue项目的核心构成。

概括起来就是：1.项目构建工具、2.路由、3.状态管理、4.http请求工具。
一、Vue-cli是快速构建这个单页应用的脚手架
1 全局安装 vue-cli
$ npm install --global vue-cli
2 启动项目
$ npm run serve
三、vuex
vuex为专门为vue.js应用程序开发的状态管理可以理解为全局的数据管理。vuex主要由五部分组成：state action、mutation、getters、module组成。

使用流程是： 组件中可以直接调用上面四个部分除了module

1、state

类似vue 对象的data, 用来存放数据以及状态。存放的数据为响应式，如果数据改变，那么依赖数据的组件也会发生相应的改变。

2、actions

Action 通过 store.dispatch 方法触发：action支持异步调用（可以调用api），mutation只支持操作同步，并且action提交的是 mutation，而不是直接变更状态。

Action 函数接受一个与 store 实例具有相同方法和属性的 context 对象，因此你可以调用 context.commit 提交一个 mutation，或者通过 context.state 和 context.getters 来获取 state 和 getters。

3、mutations
修 改 状 态 ， 并 且 是 同 步 的
每个 mutation 都有一个字符串的事件类型(type)和一个回调函数(handler)。这个回调函数就是我们实际进行状态更改的地方，并且它会接受 state 作为第一个参数。

4、getters

Vuex 允许我们在 store 中定义“getter”（可以认为是 store 的计算属性）。就像计算属性一样，getter 的返回值会根据它的依赖被缓存起来，且只有当它的依赖值发生了改变才会被重新计算

四、使用vuex统一管理状态的好处

能够在vuex中集中管理共享的数据，易于开发和后期维护；
能够高效地实现组件之间的数据共享，提高开发效率；
存储在vuex中的数据都是响应式的，能够实时保持数据与页面的同步；