Note: This is a fake project with fake datas. Unimportant setting up the token with Date.now()
My Question: I want to send userData object to vuex store.
I want to send the userData
object to the Vuex repository. But its return [object object].
I delete the userData
object and I write let user = this.username
variable instead of userData
. It works.
But it doesn't work with the;
let userData = {
name: this.username,
surname: this.surname,
}
its my login method (login.vue):
methods: {
...mapActions(['login']),
loginUser() {
let userData = {
name: this.username,
surname: this.surname,
}
this.login(userData)
}
}
and its vuex (auth.js) file
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
}
Result in vue devtools:
auth:Object
status:"Success getProfile action."
token:"1589861864025[object Object]"
user:Object
Problem solved. The final version;
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
}
};
string concatenation with object not working and it always show [object object] until you stringify Json Object like this :
let token = Date.now() + '' + JSON.stringify(user)
Your mutations and commit should be like this :
Actions :
commit('login_success', {token, user})
Mutations :
login_success(state, payload) {
state.status = 'Login success.';
state.token = payload.token;
state.user = payload.user
},