如何在Vue Router中重定向和加载相同的组件

Question

我正在尝试创建一个允许我执行以下操作的路径结构。

• Home.vue有一个路由器视图
• /home/clients应加载客户端组件
• home/campaigns应加载广告系列组件
• home/clients/:id应重定向到/home/clients/:id/campaigns并加载相同的广告系列组件。

我不想在客户端组件中引入另一个路由器视图来处理广告系列部分。我试图通过以下路线完成它，但实际上无法让它工作。

这些是/home的儿童路线。

更新：我让它真正写下了我可能遇到的每条路径。有没有办法可以优雅地解决这个问题？

{
  path: '/home',
  name: 'Home',
  component: Home,
  beforeEnter(to, from, next) {
    if (!store.getters.isLoggedIn) {
      next({
        path: '/login',
        query: {
          redirect: to.fullPath
        }
      });
    } else {
      next();
    }
  },
  children: [
    {
      path: 'clients',
      component: Clients
    },
    {
      path: 'clients/:clientId',
      redirect: 'clients/:clientId/campaigns'
    },
    {
      path: 'clients/:clientId/campaigns',
      component: Campaigns
    },
    {
      path: 'clients/:clientId/campaigns/:campaignId',
      redirect: 'clients/:clientId/campaigns/:campaignId/ads'
    },
    {
      path: 'clients/:clientId/campaigns/:campaignId/ads',
      component: Ads
    },
    {
      path: 'clients/:clientId/campaigns/:campaignId/ads/:adId',
      redirect: 'clients/:clientId/campaigns/:campaignId/ads/:adId/postings'
    },
    {
      path: 'clients/:clientId/campaigns/:campaignId/ads/:adId/postings',
      component: Postings
    },
    {
      path: 'campaigns',
      component: Campaigns
    },
    {
      path: 'campaigns/:campaignId',
      redirect: 'campaigns/:campaignId/ads'
    },
    {
      path: 'campaigns/:campaignId/ads',
      component: Ads
    },
    {
      path: 'campaigns/:campaignId/ads/:adId',
      redirect: 'campaigns/:campaignId/ads/:adId/postings'
    },
    {
      path: 'campaigns/:campaignId/ads/:adId/postings',
      component: Postings
    },
    {
      path: 'ads',
      component: Ads
    },
    {
      path: 'ads/:adId',
      redirect: 'ads/:adId/postings'
    },
    {
      path: 'ads/:adId/postings',
      component: Postings
    },
    {
      path: 'postings',
      component: Postings
    }
  ]
}