0 环境
- 系统环境:win10
1 问题
4个标签页 从右往左(当前页)删除tab 删除中间的标签页 具体报错现在有4个标签页 当我从右往左(当前页)删除tab 没有任何异常 但当我删除用户管理 就会有报错提示 如图
2 解决
方案一种在路由push是加异常处理 第二种修改移除标签方法里代码逻辑
1 路由push异常处理
// 确定没有其他的异常 可以这么玩 当然不建议这么做
this.$router.push(url).catch(()=>{});
2 修改移除标签方法里代码逻辑
仔细看就会发现 当我们点击进入某个标签页 在删除当前页 就不会报错 找到移除tab的方法 删除
if (activeName === targetName)
这个判断 在调试 ok 收工
removeTab(targetName) {
let tabs = this.editableTabs;
let activeName = this.editableTabsValue;
if (activeName === targetName) {
tabs.forEach((tab, index) => {
if (tab.name === targetName) {
let nextTab = tabs[index + 1] || tabs[index - 1];
if (nextTab) {
activeName = nextTab.name;
// console.log("activeName===>",activeName)
// this.editableTabsValue = activeName;
}
}
});
}
this.editableTabsValue = activeName;
this.editableTabs = tabs.filter((tab) => tab.name !== targetName);
// this.$router.push({name: activeName}).catch(()=>{});
this.$router.push({ name: activeName });
}
网友评论