Vuex-Commit-多级路径提交数据

Vuex 状态管理使用commit调用store方法更新数据,该算法支持多级路径对象的提交

定义方法

1
2
3
4
5
6
7
8
9
10
11
12
13
// store.js
mutations: {
setState(state, {
key,
val
}) {
if (key.split('.').length == 1) state[key.split('.')[0]] = val;
if (key.split('.').length == 2) state[key.split('.')[0]][key.split('.')[1]] = val;
if (key.split('.').length == 3) state[key.split('.')[0]][key.split('.')[1]][key.split('.')[2]] = val;
if (key.split('.').length == 4) state[key.split('.')[0]][key.split('.')[1]][key.split('.')[2]][key.split('.')[3]] = val;
if (key.split('.').length == 5) state[key.split('.')[0]][key.split('.')[1]][key.split('.')[2]][key.split('.')[3]][key.split('.')[4]] = val;
}
},

提交数据

1
store.commit('setState', { key: 'cmtList', val: ['xixi', 'haha'] })

获取数据(实时更新)

1
2
3
4
5
computed: {
list: {
get: () => store.state.cmtList
}
},