突变不更新状态

Question

I have my mutation committed, but the user state is not updated instead returns null

I recieve data in mutation The axios call returns the user, but don't update state

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);
        }
    }
})

What did I do wrong? Thankyou for helping

Answer 1

Every asynchronous operations should be done in an actions, mutation should be as simple as it is possible. In this case you should move your logic from mutation to action. Something like this:

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);
            });
        }
    }
})