我正在使用 Vue + Vuex 从 localStorage 删除用户令牌以使用户注销并将其重定向到登录页面 .
组件注销方法代码:
methods: {
logout () {
this.$store.dispatch('logout')
.then(response => {
this.$router.push({ name: 'login'});
}).catch((e) => {
console.log(e);
});
}
}
商店行动代码:
logout({commit}) {
return new Promise((resolve, reject) => {
try {
commit('logout');
resolve("done");
} catch (e) {
reject(e);
}
});
}
存储突变功能:
logout (state) {
localStorage.removeItem('user');
state.is_logged_in = false;
state.user = null;
}
问题是:
会发生什么:
-
用户重定向到登录页面 .
-
用户重定向回仪表板 .
-
删除了用户访问令牌 .
所以用户留在同一页面 .
这意味着:
调度action方法然后返回组件注销方法,然后提交变异 .