转载请注明出处：
state 提供唯一的数据资源,所有的共享的数据都要统一放到store 中的state中进行存储;
状态state用于存储所有组件的数据。
管理数据
// 初始化vuex对象
const store = new vuex.Store({
state: {
// 管理数据
count: 0
}
})
第一种访问方式
this.$store.state.全局数据名称
在组件获取state的数据：原始用法插值表达式
<!--原始用法-->
<div>A组件 state的数据：{{$store.state.count}}</div>
<!--使用计算属性-->
<div>A组件 state的数据：{{count}}</div>
使用计算属性：
// 把state中数据，定义在组件内的计算属性中
computed: {
// 1. 最完整的写法
// count: function () {
// return this.$store.state.count
// },
// 2. 缩写
count () {
return this.$store.state.count
}
}
// 不能使用箭头函数 this指向的不是vue实例
注意：
- state中的数据是自定义的，但是state属性名是固定的
- 获取数据可以通过 $store.state
- 可以使用计算属性优化模板中获取数据的方式
- 计算属性不可以使用箭头函数（箭头函数本身是没有this的，实际上用的是父级函数中的this）
第二种方式 mapState:
把vuex中的state数据映射到组件的计算属性中。
使用方法：
1.从vuex中按需求导入mapState函数
import {mapState} from 'vuex'
通过刚才导入的mapState函数，将当前组件需要的全局数据，映射为当前组件的computed计算属性
2. 将全局数据，映射为当前组件的计算属性，mapState参数是一个数组
computed :{ ...mapState(['count']) }
使用示例：
<a-input placeholder="请输入任务" class="my_ipt" :value="inputValue" />
<script>
import { mapState, mapGetters } from 'vuex'
export default {
name: 'app',
data() {
return {}
},
created() {
},
computed: {
...mapState(['inputValue']),
},
}
在网上找到一个demo 示例，可参考学习： https://gitee.com/xiangbaxiang/vue-store