Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺
使用vue 3.0 写了一个登入页面，再点击登入的时候，第一次点击会没有反应，F12查看接口都调用了但是没有跳转，控制台打印出错：
错误说有异常没有捕获；
这个错误是vue -router 内部的错误，没有进行catch处理导致的；
再vue-router3.0以上的版本新增功能：push和replace方法会返回一个promise；
解决方案：
在vue的router的js中添加下面代码
const originalPush = VueRouter.prototype.push
const originalReplace = VueRouter.prototype.replace
// push
VueRouter.prototype.push = function push (location, onResolve, onReject) {
if (onResolve || onReject) return originalPush.call(this, location, onResolve, onReject)
return originalPush.call(this, location).catch(err => err)
}
// replace
VueRouter.prototype.replace = function push (location, onResolve, onReject) {
if (onResolve || onReject) return originalReplace.call(this, location, onResolve, onReject)
return originalReplace.call(this, location).catch(err => err)
}
其中VueRouter是在vue初始化的时候引入的Router，完整代码：router/index.js
import VueRouter from 'vue-router'
Vue.use(VueRouter);
// 解决报错
const originalPush = VueRouter.prototype.push
const originalReplace = VueRouter.prototype.replace
// push
VueRouter.prototype.push = function push (location, onResolve, onReject) {
console.log(onReject + onResolve)
// if (onResolve || onReject) return originalPush.call(this, location, onResolve, onReject)
return originalPush.call(this, location).catch(err => {
console.log(err)
originalPush.call(this, location, onResolve, onReject)
});
}
// replace
VueRouter.prototype.replace = function push (location, onResolve, onReject) {
console.log(onReject + onResolve)
// if (onResolve || onReject) return originalReplace.call(this, location, onResolve, onReject)
return originalReplace.call(this, location).catch(err => {
console.log(err)
originalPush.call(this, location, onResolve, onReject)
})
}
.......
const router = new VueRouter({
mode: 'history',
base: process.env.BASE_URL,
routes
})
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
发布者：全栈程序员-站长，转载请注明出处：https://javaforall.net/158918.html原文链接：https://javaforall.net
