name: "NavigationDuplicated", message: "Navigating to current location ("/") is not allowed", stack:

谁借莪１个温暖的怀抱￠ 2023-06-25 04:47 84阅读 0赞

vue-router 报错 name: "NavigationDuplicated", message: "Navigating to current location ("/") is not allowed", stack: "Error

报错详细内容如下

log.js?4244:23 [HMR] Waiting for update signal from WDS...
    vue-router.esm.js?fe87:16 [vue-router] Named Route 'Main' has a default child route. When navigating to this named route (:to="{name: 'Main'"), the default child route will not be rendered. Remove the name from this route and use the name of the default child route for named links instead.
    warn @ vue-router.esm.js?fe87:16
    vue-router.esm.js?fe87:2051 Uncaught (in promise) NavigationDuplicated {_name: "NavigationDuplicated", name: "NavigationDuplicated", message: "Navigating to current location ("/") is not allowed", stack: "Error↵    at new NavigationDuplicated (webpack-int…al:///./node_modules/vue/dist/vue.esm.js:2187:14)"}
    (anonymous) @ vue-router.esm.js?fe87:2051
    abort @ vue-router.esm.js?fe87:2082
    confirmTransition @ vue-router.esm.js?fe87:2090
    transitionTo @ vue-router.esm.js?fe87:2034
    push @ vue-router.esm.js?fe87:2459
    (anonymous) @ vue-router.esm.js?fe87:2779
    push @ vue-router.esm.js?fe87:2778
    tohome @ main.vue?512e:57
    invokeWithErrorHandling @ vue.esm.js?efeb:1863
    invoker @ vue.esm.js?efeb:2188
    original._wrapper @ vue.esm.js?efeb:7565

**报错原因：**vue路由跳转相同的地址，即在当前路由下重复当前路由

**解决办法：**在自定义的 vue-router.js文件中添加如下内容

const routerPush = Router.prototype.push
    Router.prototype.push = function push (location) {
      return routerPush.call(this, location).catch(error => error)
    }

效果如下

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dzanp6Y2Jx_size_16_color_FFFFFF_t_70][]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dzanp6Y2Jx_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20191225223004285.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dzanp6Y2Jx,size_16,color_FFFFFF,t_70

name: "NavigationDuplicated", message: "Navigating to current location ("/") is not allowed", stack:

发表评论取消回复

还没有评论，来说两句吧...

相关阅读

相关 is not allowed to connect to this mysql server

相关 null, message from server: “Host ‘xxx‘ is not allowed to connect to this MySQL server“

相关 vue 解决办法 router的坑NavigationDuplicated {_name: "NavigationDuplicated", name: "NavigationDuplicated"

相关 name: "NavigationDuplicated", message: "Navigating to current location ("/") is not allowed", stack:

相关 Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to current location

相关 NavigationDuplicated: Avoided redundant navigation to current location: “/“.

相关 message from server: "Host is not allowed to connect to this MySQL server"解决办法

相关 message from server: "Host is not allowed to connect to this MySQL server"解决办法

相关 vue项目在点击重复路由时报错(NavigationDuplicated: Avoided redundant navigation to current location)

相关 vue项目：Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to current location