需求：管理员可以看到其他管理员，并进行新增管理员或是编辑管理员账号。在管理员自己删除自己账号的时候自己当前的账号并没有退出(这个需求就很神奇)；
删除账号，token失效，在当前账户异步请求会报错。
我的想法是登录的时候把账号存储在localstorage本地存储里，当然放在vuex里更保险，起码懂前端的人F12看不到
userLogin({ data: formStr }).then((res) => {
if (res.code === 0) {
console.log("登陆成功");
store.commit("userMessage", res.data);
store.commit("user/SET_TOKEN", res.data.token);
const info = {
user: {
info: {
access_token: res.data.token,
username: res.data.userName,
},
},
};
store.commit("user/SET_INFO", info);
this.$router.push("/");
} else {
this.timestamp = new Date().getTime();
}
});
然后在删除的时候从store里抓取出来进行比较
// 删除
del(row) {
const userMessage = this.$store.state.userMessage;
this.$confirm("确定删除该用户吗？", "提示", {
type: "warning",
}).then(() => {
const ids = {
ids: [row.id],
};
reqDeletesUser(ids).then((res) => {
if (res.code === 0 && userMessage.loginName !== row.loginName) {
this.$message.success("删除成功！");
this.$refs.zyTable.reloadData();
}
if (res.code === 0 && userMessage.loginName == row.loginName) {
this.$message.success("删除成功！");
this.$store.dispatch("user/logout").then(() => {
this.$router.push("/login");
});
}
});
});
},
附件vuex里的logout
logout({ dispatch }, flag = false) {
return new Promise((resolve) => {
// 无需调用退出登录接口
if (!flag) {
dispatch("clearLoginInfo");
resolve();
} else {
userLogout().then(() => {
dispatch("clearLoginInfo");
resolve();
});
}
});
},
这个时候遇到了问题
this.$router.push("/login"); 跳不过去，很奇怪，接下来我把router跳转甚至location.href和history.go都用上了，但还是没用，后来查文档，发现了问题（好吧，是个视频。。。）
这个链接有讲解
原因是vue2.2 or 2.3 出现的问题，跳转页面失效
解决方案如下
在src/router/index.js内添加如下代码
const originaPush = VueRouter.prototype.push;
VueRouter.prototype.push = function push(location, onResolve, onReject) {
if (onResolve || onReject)
return originaPush.call(this, location, onResolve, onReject);
return originaPush.call(this, location).catch((err) => err);
};
Vue.use(VueRouter);
我是放在Vue.use(VueRouter);前的
之后再用this.$router.push("/login");进行跳转，跳转成功；
当然，这是跳转失败的一种可能性，如果不是这个原因再翻翻吧，加油！
结束
保持学习！
如果看客们感觉有帮助，还请大家点个小心心❤，我会持续更新的！
