vuex getters和mapGetters不更新的问题
在compents里面commit了state也更新了,但是getters和mapGetters却没有更新,显示undefinedvuex代码:import {setCode, getCode} from '@/utils/api'import Vue from 'vue'const user = {states: {code: getCode(),current...
·
在compents里面commit了state也更新了,但是getters和mapGetters却没有更新,显示undefined
vuex代码:
import {setCode, getCode} from '@/utils/api'
import Vue from 'vue'
const user = {
states: {
code: getCode(),
currentArea: {}
},
mutations: {
SET_CODE: (state,code) => {
state.code = code
setCode(code)
},
SET_CURRENT_AREA: (state, area) => {
state.currentArea = area
},
...
},
actions: {
...
}
}
export default user
组件里的代码:
<template>
...
</template>
<script>
import {mapGetters} from 'vuex'
export default{
...
methods: {
changeArea(area){
this.$store.commit('SET_CURRENT_AREA',area)
}
},
computed: {
...mapGetters([
'currentArea'
]),
}
</script>
奇怪的是,commit之后使用vue-Devtools里发现state里的值已经发生了更新,但是getters和mapGetters里却没有更新,值为undefined。
后面发现原来是设置值的时候有问题,在mutations里面的触发方法里面不能直接使用state赋值的方式而应该使用Vue.set的方式,于是把代码改成如下方式就可以了:
import {setCode, getCode} from '@/utils/api'
import Vue from 'vue'
const user = {
...
mutations: {
...
SET_CURRENT_AREA: (state, area) => {
Vue.set(state,'currentArea',area)
}
}
}
export default user
更多推荐
已为社区贡献2条内容
所有评论(0)