vue-router 点击链接跳到非嵌套的路由中 应该怎么实现？

Question

在当前这个页面下, 下面那一大块是一个router-view

浏览器中的地址栏是:

我希望做到的是点击详情 然后跳转到/audit/records/detail?id=...

上面依然有 待审核 和 审核记录的 小标题 但是下面的部分从"已审核"开始 是一个新的

页面，里面是审核详情，

这个应该怎么实现?或者说这个router-view应该放在哪个页面中？是不是还要控制不同router-view的显示隐藏?

附router.js:

mode: 'history',
  base: process.env.BASE_URL,
  routes: [
    {
      path: '/',
      name: 'index',
      component: index,
      // meta: { requiresAuth: true },
      redirect: 'audit',
      children: [
        {
          path: 'audit',
          component: audit,
          redirect: 'audit/auditing',
          children: [
            {
              path: 'auditing',
              component: auditing
            },
            {
              path: 'records',
              component: records,
              children: [
                {
                  path: 'auditDetail',
                  component: auditDetail
                }
              ]
            }
          ]
        },

Answer 1

说一下我的几种想法吧

• 和@OBKoro1类似，用一个新的页面来展示详情,设置方法就是target="_blank",只是这样就与单页面应用这个理念不相符了
• 在待审核/审核记录那一栏增加一个审核详情， 把auditDetail的路由设置为与records同级，点击详情的时候切换到对应的页面就行了
• 用类似bootstrap里面的模态框来显示这个详情，不用路由来切换，点击的时候替换内容就可以了

Answer 2

就加一个target,该怎么跳转就怎么跳转，试一下就知道了。

    <router-link target="_blank">
    </router-link>