vuex

state
在store里面的index中的state定义全局共享的数据
组件访问state数据中的方式
1 在其他的组件 this.$store.state.count中访问全局共享数据
2. 在组件中按需导入mapState函数 import { mapState } from ‘vuex’
将全局数据映射为当前组件的计算属性 … 展开运算符
computed: {
…mapState([‘count’])
}
然后就可以直接在组件中使用了 {{count}}
mutation
Mutation 用于变更Store中的数据
注意 : 只能通过mutation变更store中的数据 不可以直接操作store的数据 这样是不合法的
在Mutation中定义一个函数
如自增 add(state) {
state.count++
}
触发mutation的第一种方式
this.$store.commit(‘add’,参数)
第二种方式
在组件中1
},1000)
}

触发action
this.$store.dispatch('addAsync')
第二种方式
按需导入mapAction 在methods中 …mapAction([‘addAsync’])
commit的作用就是专门触发mutation dispatch就是专门触发action
getters
getter用于对store中的数据进行加工处理形成新的数据
store中的数据进行变化 getter的数据也会跟着变化
getters: {
showNum: state =>{
return ‘新的数据是[’+ state.count +’]’
}
}
使用方式: this.$store.getters.名称
第二种方式
import导入 mapGetters
在computed计算属性中 …mapGetters([‘showNum’])
然后就可以直接使用了 {{showNum}}