Question

注意：这是一个包含伪造数据的伪造项目。使用Date.now（）设置令牌并不重要

我的问题：我想将userData对象发送到vuex存储。

我想将userData对象发送到Vuex存储库。但是它返回[object object]。

我删除userData对象，然后写let user = this.username变量而不是userData。可以。

但是它不适用于

let userData = {
    name: this.username,
    surname: this.surname,
}

其登录方法（login.vue）：

    methods: {
        ...mapActions(['login']),
        loginUser() {

            let userData = {
                name: this.username,
                surname: this.surname,
            }
            this.login(userData)
        }
    }

及其vuex（auth.js）文件

   const state = {
       token: localStorage.getItem('token') || '',
       user: {},
       status: ''
   };

   const getters = {
       isLoggedIn: state => !!state.token,
       user: state => state.user
   };

   const actions = {
       async login({commit}, user) {
           commit('login_request');
           let token = Date.now() + '' + user
           localStorage.setItem('token', token);
           localStorage.setItem('user', user);
           commit('login_success', token, user)
           router.push('/')
       },

       async getProfile({commit}) {
           commit('profile_request');
           let profile = await localStorage.getItem('user')
           commit('user_profile', profile);
       },
   }

   const mutations = {
       login_request(state) {
           state.status = 'Loading login action.'
       },
       login_success(state, token, user) {
           state.status = 'Login success.';
           state.token = token;
           state.user = user
       },
       profile_request(state) {
           state.status = 'Loading user profile.'
       },
       user_profile(state, user) {
           state.status = 'Success getProfile action.'
           state.user = user
       }

vue devtools中的结果：

auth:Object
    status:"Success getProfile action."
    token:"1589861864025[object Object]"
    user:Object

问题已解决。最终版本；

const actions = {
    async login({commit}, user) {
        commit('login_request');
        let token = Date.now() + '' + user.name;
        localStorage.setItem('token', token);
        localStorage.setItem('user', user.name)
        commit('login_success', {token, user})
        router.push('/')
    },
    async getProfile({commit}, {user}) {
        commit('profile_request');
        let profile = user
        commit('user_profile', profile);
    },
};

const mutations = {
    login_request(state) {
        state.status = 'Loading login action.'
    },
    login_success(state, payload) {
        state.status = 'Login success.';
        state.token = payload.token;
        state.user = payload.user
    },
    profile_request(state) {
        state.status = 'Loading user profile.'
    },
    user_profile(state, user) {
        state.status = 'Success getProfile action.'
        state.user = user
    }
};

Answer 1

与对象的字符串连接不起作用，并且在像这样对Json Object进行字符串化之前，它始终显示[object object]：

commit('login_success', {token, user})

您的突变和提交应如下所示：

动作：

login_success(state, payload) {
 state.status = 'Login success.';
 state.token = payload.token;
 state.user = payload.user
},

突变：

{{1}}

如何将对象数据从vue组件发送到vuex存储？

1 个答案: