④ 当 State 中的数据被改变之后，就会重新渲染（Render）到 Vue Components 中去，组件展示更新后的数据，完成一个流程。
Vuex 的核心是 Store（仓库），相当于是一个容器，一个 Store 实例中包含以下属性的方法：
state 定义属性（状态 、数据）
store.js 中写入
// 定义属性（数据）
var state = {
count:6
}
// 创建 store 对象
const store = new Vuex.Store({
state
})// 导出 store 对象
export default store;
方式1、 在 app.vue 中就能通过 this.$store 访问该 store 对象 ，获取该 count 。
<template>
<div id="app">
//把 count 方法直接写入，可自己执行
<h1>{{count}}</h1>
</div>
</template><script>
export default {
name: 'app',
computed:{
count(){
//返回获取到的数据
return this.$store.state.count
}
}
}
</script>
方式2、vuex 提供的 mapGetters 和 mapActions 来访问
mapGetters 用来获取属性（数据）
① 在 app.vue 中引入 mapGetters
import {mapGetters} from 'vuex'② 在 app.vue 文件的计算属性中调用 mapGetters 辅助方法，并传入一个数组，在数组中指定要获取的属性 count
<script>
import {mapGetters,mapActions} from 'vuex'
export default {
name: 'app',
computed:mapGetters([
//此处的 count 与以下 store.js 文件中 getters 内的 count 相对应
'count'
])
}
</script>
③ 在 store.js 中定义 getters 方法并导出
getters 用来获取属性
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)// 定义属性（数据）
var state = {
count:6
}
// 定义 getters
var getters={
//需要传个形参，用来获取 state 属性
count(state){
return state.count
}
}
// 创建 store 对象
const store = new Vuex.Store({
state,
getters
})
// 导出 store 对象
export default store;
这样页面上就会显示传过来的数据了！接下来我们来通过动作改变获取到的数据
④在 store.js 中定义 actions 和 mutations 方法并导出
actions 定义方法（动作）
commit 提交变化，修改数据的唯一方式就是显示的提交 mutations
mutations 定义变化，处理状态（数据）的改变
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)// 定义属性（数据）
var state = {
