[英]Why Vuex doesn't update state inside module?
Using Vue 2. My state isn't updated inside module.使用 Vue 2。我的 state 没有在模块内部更新。 I created simplified example of my code.
我创建了我的代码的简化示例。 Store config:
存储配置:
import Vue from "vue";
import Vuex, { StoreOptions } from "vuex";
import users from "@/store/modules/users";
import test from "@/store/modules/test";
import { vuexfireMutations } from "vuexfire";
import { RootState } from "@/store/types";
Vue.use(Vuex);
const store: StoreOptions<RootState> = {
state: {
version: 0
},
mutations: {
...vuexfireMutations
},
actions: {},
modules: { users, /* other modules */ test },
strict: process.env.NODE_ENV !== "production"
};
export default new Vuex.Store<RootState>(store);
Individual module (test.ts):单个模块(test.ts):
import { RootState, TestState } from "@/store/types";
import { ActionTree, GetterTree, Module, MutationTree } from "vuex";
const getters: GetterTree<TestState, RootState> = {};
const mutations: MutationTree<TestState> = {
SET_TEST(state, nextState: TestState) {
console.log("current", state); //shows correct current state
// let's say nextState is following: { test: "Hi!" }
console.log("next", nextState); //show correct next state
state = { ...state, ...nextState, loaded: true };
},
};
const actions: ActionTree<TestState, RootState> = {
setTest({ commit }, payload: TestState) {
commit("SET_TEST", payload);
}
};
const test: Module<TestState, RootState> = {
namespaced: true,
state: {
loaded: false
},
getters,
mutations,
actions
};
export default test;
After dispatching setTest
action, everything goes properly through vuex except mutation.在调度
setTest
操作之后,除了突变之外,一切都通过 vuex 正常进行。 Next action payload is exactly what I want but my state for that module still shows test: { loaded: false }
, but should be: test: { test: "Hi,": loaded: true"}
Next action payload 正是我想要的,但我对该模块的 state 仍然显示
test: { loaded: false }
,但应该是: test: { test: "Hi,": loaded: true"}
You should not assign to the state
- because you will replace a reactive Object with a non-reactive one.您不应分配给
state
- 因为您会将反应性 Object 替换为非反应性的。
Instead, create a key/property inside the state
- and mutate its value.相反,在
state
中创建一个键/属性 - 并改变它的值。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.