关于Vuex

Vuex是什么？

Vuex是一个专为vue.js应用程序开发的状态管理模式。他采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。Vuex也集成到Vue的官方调试工具 devtools extension ，提供了诸如零配置的time-travel调试、状态快照导入导出等高级调试功能
什么是‘状态管理模式’？
让我们从一个简单的Vue计数应用开始:

new Vue({
	// state
	data(){
		return{
			count:0
		}
	},
	// view
	template:`<div>{{ count }}</div>`,
	// actions
	methods:{
		increment(){
			this.count++
		}
	}
})

这个状态自管理应用包含以下几个部分：
state , 举动应用的数据源
view , 以声明方式将 state 映射到视图
actions ， 响应在 view 上的用户输入导致的状态变化

以下是一个表示‘单项数据流’概念的简单示意:

萨达
但是，当我们的应用遇到多个组件共享状态时，单向数据流的简洁性很容易被破坏：
多个视图依赖于同一状态。
来自不同视图的行为需要变更同一状态。

对于问题一，传参的方法对于多层嵌套的组件将会非常繁琐，并且对于兄弟组件间的状态传递无能为力。

对于问题二，我们经常采用父子组件直接引用或者通过事件来变更和同步状态的多份拷贝。以上的这些模式非常脆弱，通常会导致无法维护的代码。

因此，我们为什么不把组件的共享状态抽取出来，以一个全局单例模式管理呢？在这种模式下，我们的组件树构成了一个巨大的‘视图’，不管在树的哪个位置，任何组件都能获取状态或者触发行为！

通过定义和隔离状态管理中的各种概念并通过强制规则维持视图和状态间的独立性，我们的代码将会变得更结构化且易维护。

这就是Vuex背后的基本思想，借鉴了 Flux 、Redux 和 The Elm Architecture。与其他模式不同的是，Vuex 是专门为 Vue.js 设计的状态管理库，以利用 Vue.js 的细粒度数据响应机制来进行高效的状态更新。

什么情况下我们应该使用 Vuex？
Vuex 可以帮助我们管理共享状态，并附带了更多的概念和框架。这需要对短期和长期效益进行权衡。

State
单一状态树
Vuex使用单一状态树——是的，用一个对象就包含了全部的应用层级状态。至此它便作为一个“唯一数据源(SSOT)”而存在。这也意味着，每个应用将仅仅包含一个 store 实例。单一状态树让我们能够直接地定位任一特定的状态片段，在调试的过程中也能轻易地去的整个当前应用状态的快照。

在 Vue 组件中获得 Vuex 状态
由于Vuex的状态存储是响应式的，从 store 实例中读取状态最简单的方法就是在计算属性中返回某个状态：

// 创建一个 Counter 组件
const Counter =  {
	template:`<div>{{ count }}</div>`,
	conputed:{
		count(){
			return store.state.count
		}
	}
}

然而，这种模式导致组件依赖全局状态单例。在模块化的构建系统中，在每个需要使用 state 的组建中需要频繁地导入，并且在测试组件时需要模拟状态。