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

谁借莪1个温暖的怀抱¢ 2023-06-25 04:47 216阅读 0赞

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

报错详细内容如下

  1. log.js?4244:23 [HMR] Waiting for update signal from WDS...
  2. 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.
  3. warn @ vue-router.esm.js?fe87:16
  4. 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)"}
  5. (anonymous) @ vue-router.esm.js?fe87:2051
  6. abort @ vue-router.esm.js?fe87:2082
  7. confirmTransition @ vue-router.esm.js?fe87:2090
  8. transitionTo @ vue-router.esm.js?fe87:2034
  9. push @ vue-router.esm.js?fe87:2459
  10. (anonymous) @ vue-router.esm.js?fe87:2779
  11. push @ vue-router.esm.js?fe87:2778
  12. tohome @ main.vue?512e:57
  13. invokeWithErrorHandling @ vue.esm.js?efeb:1863
  14. invoker @ vue.esm.js?efeb:2188
  15. original._wrapper @ vue.esm.js?efeb:7565

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

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

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

效果如下

watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dzanp6Y2Jx_size_16_color_FFFFFF_t_70

发表评论

表情:
评论列表 (有 0 条评论,216人围观)

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

相关阅读