state 是Vuex中的基本数据，state 上存放的就是所谓的状态。当没有使用 state 的时候，直接在 data 中进行初始化，有了 state 之后，我们就把 data 上的数据转移到 state 上去了。
单一状态树
Vuex 使用到的是单一状态树，即用一个对象就包含了全部的状态数据。也就是说如果我们定义了一个 store 的实例，那么这个 store 实例里面只有一个 state。state作为构造器选项，定义了所有我们需要的基本状态参数。
单一状态树让我们能够直接地定位任一特定的状态片段，在调试的过程中也能轻易地取得整个当前应用状态的快照。
在Vue组件中获得 Vuex 状态
从store实例中读取状态最简单的方法就是在计算属性中返回某个状态。
示例：
例如我们在state中定义一个count属性，给它赋一个值为10，store.js文件内容如下所示：
import Vue from 'vue' // 引入vueimport Vuex from 'vuex' // 引入vuexVue.use(Vuex) const state = { count: 10}export default new Vuex.Store({ state})然后创建一个 Counter组件，在组件中返回count，内容如下所示：
const Counter = { template: `<div> count的值为：{{ count }}</div>`, computed: { count () { return store.state.count //返回store实例的count状态 } }}每当 store.state.count 变化的时候，都会重新求取count属性，并刷新界面。
这种模式依赖于全局的管理员 store，如果模块多了，那么每个模块或者页面只要用到了这个 state 里面的数据，都得把 store 引入进来，这样的操作确实有点难受。所以出现了下面这种解决办法。
Vuex 通过store 选项，提供了一种机制将状态从根组件 “注入” 到每一个子组件中：
new Vue({ el: '#app', store, // 根组件通过store选项将store实例注入所有地子组件 // 子组件 components: { Counter }, template: ` <div class="app"> <counter></counter> </div> `})Vue项目的index.html文件内容如下所示：
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>侠课岛</title> </head> <body> <h1>侠课岛欢迎你</h1> <div id="app"></div> </body></html>最终我们使用 npm run dev 运行项目，浏览器中的输出结果如下图所示，如果我们在state中改变count的值，页面会自动刷新：
mapState辅助函数
当一个组件需要获取多个状态时候，将这些状态都声明为计算属性会有些重复和冗余。为了解决这个问题，我们可以使用 mapState 辅助函数帮助我们生成计算属性，让你少按几次键。
示例：
在使用mapState函数之前，需要先引入它：
import { mapState } from 'vuex'引入后才可以开始使用，它两种用法，可以接受一个对象或接受一个数组。
对象用法如下：
import { mapState } from 'vuex'export default { // 下面这两种写法都可以 computed: mapState({ // 组件内的每一个属性函数都会获得一个默认参数state,然后通过state直接获取它的属性 count: state => state.count, // 'count' 直接映射到state对象中的count,相当于this.$store.state.count count: 'count' })}数组用法如下所示：
// 当映射的计算属性的名称与 state 的子节点名称相同时，我们也可以给mapState传一个字符串数组。export default { computed: mapState([ // 数组 'count' ])}链接：https://www.9xkd.com/