vuejs菜单重复点击路由报错原因是因为在this.$router.push
的时候没有添加成功或失败的回调。
方法一:在路由router文件中新增以下判断
const router = new VueRouter({
routes: []
})
// 解决重复点击报错bug
const VueRouterPush = VueRouter.prototype.push;
VueRouter.prototype.push = function push (to) {
return VueRouterPush.call(this, to).catch(err => err);
}
export default router;
方法二:路由跳转时先判断路由是否重复跳转
handleClickMenu(menu) {
if(this.$route.path !== menu.url){
this.$router.push({path: menu.url});
}
}
方法三:利用catch方法捕获router.push异常
handleClickMenu(menu) {
if(this.$route.path !== menu.url){
this.$router.push({path: menu.url});
}
}
以上是编程学习网小编为您介绍的“vuejs菜单重复点击路由报错原因分析(解决方法)”的全面内容,想了解更多关于 vuejs 内容,请继续关注编程基础学习网。
织梦狗教程
本文标题为:vuejs菜单重复点击路由报错原因分析(解决方法)


基础教程推荐
猜你喜欢
- jQuery实现每隔一段时间自动更换样式的方法分析 2024-02-08
- mysql-在Yii中排序CHtml :: listData下拉列表 2023-10-26
- jquery实现的导航固定效果 2024-02-05
- el-table实现拖拽行排序sortablejs 2025-01-13
- 瀑布流布局的两种实现方式:传统多列浮动和绝对定位布局 2023-12-30
- HTML基本语法和语义写法规则与实例 2022-11-16
- 全新DHTMLX甘特图:可用于纯React,Svelte和Vue.js中Web开发 2023-10-27
- JavaScript中高阶函数的巧妙运用 2023-07-10
- 解决react-connect中使用forwardRef遇到的问题 2023-07-09
- ajax实现页面的局部加载 2023-02-22