Here lies the declaration of my current state:
export default new Vuex.Store({
state: {
items: [
],
user: {
isAuthenticated: false,
info: {
createdAt: '',
email: '',
firstName: '',
id: '',
lastName: '',
},
token: {
accessToken: '',
expiresIn: '',
refreshToken: '',
tokenType: '',
},
},
},
actions,
mutations,
getters,
plugins: [createPersistedState({
key: 'persistedState',
paths: ['user'],
})],
strict: process.env.NODE_ENV !== 'production',
});
I maintain a separate default user state to avoid manual property resets when needed.
export const defaultUser = {
isAuthenticated: false,
info: {
createdAt: '',
email: '',
firstName: '',
id: '',
lastName: '',
},
token: {
accessToken: '',
expiresIn: '',
refreshToken: '',
tokenType: '',
},
};
During a logout action:
export const logout = ({ commit, dispatch }) => {
commit(types.LOGOUT_USER);
dispatch('changeStatus', 'You need to login or register.');
};
[types.LOGOUT_USER](state) {
Object.assign(state.user, defaultUser);
},
However, there are moments when the user object doesn't seem to get completely replaced... (or is the default state retaining previous values?)