关于重复点击同一个路由出现的报错问题解决

94 阅读1分钟

在新版本的vue-router中,重复点击同一个路由会出现以下报错:

image.png

解决方案如下:

方案1、vue-router降级处理(但不推荐)

npm i vue-router@3.0.7

方案2、直接在push方法最后添加异常捕获,例如:

<van-search v-model="SearchVal" shape="round" placeholder="请输入搜索关键词" disabled @click="$router.push('/home/searchPopup').catch(err=>{})"/>

方案3、直接修改原型方法push(推荐)

// 把这段代码直接粘贴到router/index.js中的Vue.use(VueRouter)之前
const originalPush = VueRouter.prototype.push;
VueRouter.prototype.push = function(location) {
  return originalPush.call(this, location).catch(err => {})
};