vue路由点击面包屑的时候跳转不回去了?

image.png
点击分析详情页的时候跳转到404页面了

children: [
  {
    path: '/compromise/activity',
    // component: () => import('@/views/compromise/act/components/activity.vue'),
    component: { render(c) { return c('router-view') } },
    name: 'activity',
    redirect: '/compromise/activity',
    hidden: true,
    children: [
      {
        path: '/compromise/activity',
        component: () => import('@/views/compromise/act/components/activity.vue'),
        hidden: true
      },
      {
        path: '/compromise/activity/summary:task_id(\\d+)',
        component: { render(c) { return c('router-view') } },
        name: 'summary',
        redirect: '/compromise/activity/summary',
        meta: { title: '分析详情页' },
        hidden: true,
        children: [
          {
            path: '/compromise/activity/summary/:task_id(\\d+)',
            component: () => import('@/views/compromise/upload/components/msaContent/msa.vue'),
            meta: { title: '' },
            hidden: true
          },
          {
            path: '/compromise/activity/summary/flow/:task_id(\\d+)',
            component: () => import('@/views/compromise/upload/components/msaContent/flow/index.vue'),
            name: 'flowCompromise',
            meta: { title: '流量数据' },
            hidden: true
          }
        ]
      }
    ]
  }
]

点击分析详情页的时候跳转到404页面了
各位大哥,该如何解决?可以提供个思路吗?

阅读 2.5k
3 个回答

我觉得你应该贴上来的是面包屑组件的 data 而不是路由组件的 data .
看你是按照 router.matched 的返回值去生成的面包屑,还是按照路由堆栈去生成的面包屑。

要是按照 router.matched 生成的,那肯定是 404 哇。因为你的详情页是动态路由啊。你可以输出一下你的面包屑导航生成的 data,来检查我说的是不是正确的。


如果想要返回的话,得写一个导航守卫把你每次跳转的页面缓存起来。按照历史堆栈来渲染面包屑导航。
不过也可以按照 fullPath 按照你的动态路由规则去生成详情页的动态路由值。这样虽然业务代码少一些。但是规则处理的代码就会比较复杂了,看你自己喜欢那种方式了。

this.$router.push()

不就是能解决路由跳转
你这里的代码需要看一下 业务组件里的处理逻辑

贴这个代码干啥

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
宣传栏