At times, the token is committed to Vuex store while other times it is not.
userLogin() {
axios.post('api/login', this.logindata,)
.then(response => {
let token = JSON.parse(localStorage.getItem('token'));
this.$store.commit('setToken', token);
this.logindata = {};
this.loaded = true;
this.success = true;
this.$router.push({path: '/'});
});
}
Below is the store.js:
export default new Vuex.Store({
state: {
token: JSON.parse(localStorage.getItem('token')),
isLoggedIn: !!localStorage.getItem('token'),
cart: []
},
mutations: {
setToken(state, token) {
state.token = token;
},
}
});
Here is Vue Frontend:
mounted: function () {
if (!this.$store.state.isLoggedIn) {
this.$router.push('/login')
}
}
Outcome: there are occasions when it redirects to login and instances where it does not. Any insights on how to address this issue?