I’m going to write the way how to overcome a messy Vuex usage.
Let’s create an object to use it as a command.
export const COMMAND = {
A: {
LIST: “A_LIST”
LIST_CNT: “A_LIST_CNT”
}
};
import it and use it in a store js file.
import {COMMAND as C } from “@/const/command”;
const COMMAND = C.A;
export default {
state: {
[COMMAND.LIST]: ‘’
[COMMAND.LIST_CNT]: 0
},
mutations: {
[COMMAND.LIST](state, list){
state[COMMAND.LIST] = list;
}
[COMMAND.LIST_CNT](state, cnt){
state[COMMAND.LIST_CNT] = cnt;
}
},
actions: {
[COMMAND.LIST]({commit}, list) {
commit(COMMAND.LIST, list);
},
[COMMAND.LIST_CNT]({commit}, cnt){
commit(COMMAND.LIST_CNT, cnt);
}
},
}
export {mapState: aState, mapActions: aActions} = createNamespaceHelpers(“a/a”);
in your vue file.
…
computed: {
…aState([COMMAND.A.LIST, COMMAND.A.LIST_CNT]
}
Happy coding!