1.存在vuex中的数据是对象数组类型
2.数据是根据不同id切换请求的,在actions处理
3.需要替换整个对象数组数据而不是数组中某一个字段
4.数据是成功切换了,就是视图无法更新,需要刷新才能更新
请教一下各位大佬,有没有遇到这种情况。
5.视图是弹出层的table数据,用的是iview组件的table,需要更新是一个下拉框options的数据,数据成功改变了但是无法触发视图options的数据更新
state:
EnergySROptions: [], //格式是[{value: '',label: ''}]
mutations
setEnergySROptions(state, arr) {
console.log(arr, 'arr');
Vue.set(state, 'EnergySROptions', arr) //试过了无效
state.EnergySROptions = JSON.parse(JSON.stringify(state.EnergySROptions)) //试过了无效
}
actions
getEnergyOptData(context) {
let d = {
page: 1,
limit: 10,
flag: 'get_IntegrityProtAlgorithm_list',
sear: localRead('node'),
}
let url = "overall.cgi";
http.common.postByUrlAndData(url, d).then((res) => {
if (res) {
var optionData = res.data.enum_rows;
var EnergySROption = []
var optionArr = optionData[0].option;
optionArr.forEach((e) => {
EnergySROption.push({ value: e, label: e, })
})
context.commit('setEnergySROptions', EnergySROption)
}
})
}
很简单的一个窍门就是,你在
Vue2
中修改数组要么用$set
,要么就用list = newList
这样的形式去做。如果你是修改了对象数组内部某一个对象的属性,
Vue
是无法感知的。因为Store
里面修改State
是没有$set
这个可选项的,就需要你去用list = newList
这种方法,并在且组件中使用时选用下面两种方式派发: