router.push的报错如何捕获？

  • Z时代
  • 2024-03-14
  • 分类：IT

router.push({
                        name: 'xxxxx',
                    })

跳转地址因为权限问题实际上在路由列表内是不存在的，直接报错

我使用了官方文档上的报错捕捉方法都未能捕捉报错，

const navigationResult = await router.push('/my-profile')
if (navigationResult) {
  // 导航被阻止
} else {
  // 导航成功 (包括重新导航的情况)
  this.isMenuOpen = false
}
import { NavigationFailureType, isNavigationFailure } from 'vue-router'
// 试图离开未保存的编辑文本界面
const failure = await router.push('/articles/2')
if (isNavigationFailure(failure, NavigationFailureType.aborted)) {
  // 给用户显示一个小通知
  showToast('You have unsaved changes, discard and leave anyway?')
}

好像是官网的方法都是捕捉正常跳转的报错，而我的场景是因权限问题导致的，跳转目标不存在，

Uncaught (in promise) Error: No match for
 {"name":"xxxxx","params":{}}

有没有谁知道怎么捕获这个报错，
我自己找到一个解决方法是在跳转前加个hasRoute判断下路由是否存在来避免这种报错场景，但还是没找到捕获报错的方法

回答：

router.push({}).catch(error => {
    console.log("报错了", error)
})

回答：

不清楚你的路由权限是怎么做的，但是，是否可以从检测要跳转页面的连通性来处理呢，可以参考一下我的文章：https://blog.i-xiao.space/pos...

回答：

可以使用router.hasRoute(name) 来进行判断当前路由是否存在;
hasRoute 这是文档地址;

以上是 router.push的报错如何捕获？ 的全部内容， 来源链接： utcz.com/p/932926.html

回到顶部