vuex this.$store.state.属性和mapState的属性中的一点点区别

Posted 2021-01-27 zhx119

做泰康公众号的项目时候有一个需求创建公众号的时候后台有一个社区id提供给后台展现人员和部门，在群发消息时候也要给后台一个社区id只不过获取社区的id接口和上一个不是一样的，本来在页面中写了两个select，一个是用elementUI的select选择器，另一个是在标签选择器，现在在创建公众号时使用公众号社区的id让群发消息的select隐藏，我是用vuex在state里声明两个变量分别设置falese ,true,这样在引用各个接口时候v-show显示相应的数据，用this.$store.state.属性是可以设置和获取相应的值，但是用mapState属性能获取但是设置不了值，如果设置就会报错，如果设置需要在mutations中来处理。代码如下

state:

export default {
  selectAcounts: true, // 创建公众号
  selectMassmessag: false // 群发社区
}
mutations:

export default {
  updateLoginStatus (state, bool) {
    state.isLogin = bool
  },
  updateselectAcounts (state, bool) {
    state.selectAcounts = bool
  },
  updateselectMassmessag (state, bool) {
    state.selectMassmessag = bool
  },
}
在组件方法中引入mapMutations
methods:{

...mapMutations([‘updateselectAcounts‘, ‘updateselectMassmessag‘])
//点击选择按钮时候出发mapMutations中的两个方法改变state中的值 也可以通过this.store.$state.selectAcounts = false和this.$store.state.selectMassmessag = true来重新设置值

showTreeToast (type) {

this.updateselectMassmessag(true)

this.updateselectAcounts(false)

}

}