突變不更新狀態

Question

我已提交更改，但用戶狀態未更新而是返回 null

我收到變異數據 axios 調用返回用戶，但不更新狀態

export default new Vuex.Store({
    state: {
        user: null
    },
    getters: {
        getUser: state => {
            return state.user;
        }
    },
    mutations: {
        setUser(state, user) {
            let url = domain + "user";
            axios
                .get(url, {
                    params: {
                        uuid: user.uid
                    }
                })
                .then(res => {
                    Vue.set(state, user, res.data)
                      // tried    state.user = res.data

                })
                .catch(err => {
                    console.log(err);
                });
        }
    },
    actions: {
        setUser(context, user) {
            context.commit('setUser', user);
        }
    }
})

我做錯了什么？ 感謝您的幫助

Answer 1

每個異步操作都應該在一個動作中完成，變異應該盡可能簡單。 在這種情況下，您應該將您的邏輯從變異轉移到行動。 像這樣的東西：

export default new Vuex.Store({
    state: {
        user: null
    },
    getters: {
        getUser: state => {
            return state.user;
        }
    },
    mutations: {
        setUser(state, user) {
            Vue.set(state, 'user', user)
        }
    },
    actions: {
        getUser(context, user) {
            let url = domain + "user";
            axios.get(url, {
                params: {
                    uuid: user.uid
                }
            }).then(res => {
                context.commit('setUser', res.data)

            }).catch(err => {
                console.log(err);
            });
        }
    }
})