### State
#### 单一状态树
Vuex使用**单一状态树**，用一个对象包含了**全部的应用层级状态**。作为一个“唯一数据源（SSOT）”而存在。
这意味着，每个应用将**仅仅包含一个store实例**。单一状态树让我们能够直接定位任一特定的状态片段，在调试过程中也能轻易取得整个当前应用的快照。
单状态书和模块化不冲突。
#### 在Vue组件中获得Vuex状态
由于Vuex的存储是响应式的，从store实例中读取状态最简单的方法是在计算属性中返回某个状态。
```
computed: {
count () {
return store.state.count
}
}
```
每当 store.state.count 变化的时候, 都会重新求取计算属性，并且触发更新相关联的 DOM。
然而，这种模式导致组件**依赖全局状态单例**。在模块化构建系统中，在每个需要使用state的组件中需要**频繁导入**，并且在测试组件是**需要模拟状态**。
Vuex通过store选项，提供了一种机制**将状态从根组件“注入”到每一个子组件中**（需要调用Vue.use（Vuex））：
```
const app=new Vue({
el:'#app',
//把store对象提供给“store”选项，这可以把store的实例注入所有的子组件，
store，
component：{Conter}
})
```
通过在根实例中注册store选项，该store实例会注入到根组件下的所有子组件中，且**子组件通过this.$store访问**到。
```
export default {
name: 'App',
store,
data(){
return{
}
},
}
```
子组件
```
computed:{
count(){
return this.$store.state.count
}
},
methods:{
increment(){
this.$store.commit('increment')
},
decrement(){
this.$store.commit('decrement')
}
}
```
#### mapState辅助函数
当一个组件需要获取多个状态时，多个计算属性会重复和冗余。
```
```
#### 对象展开运算符
mapState 函数返回的是一个对象。
```
computed: {
localComputed () { /* ... */ },
// 使用对象展开运算符将此对象混入到外部对象中
...mapState({
// ...
})
}
```
### 组件仍然保有局部状态
使用 Vuex 并不意味着你需要将**所有的状态**放入 Vuex。更**显式和易调试**，但也会使代码变得**冗长和不直观**。如果有些状态**严格属于单个组件**，最好还是作为组件的局部状态。
