zoukankan      html  css  js  c++  java
  • vue-router在两个以上子路由的情况下,跳转出错

      先说原因: 子路由的路径如果是  :id  那么在添加相同级别的子路由就是没用的;因为 :id  可以匹配使一个路由匹配多个不同的子路由;

     今天做毕设的时候,想在原本就有子路由的 根路径上多加一个子路由,以实现 下方 tabbar 的点击不改变;

      {
        path: '/home',
        name: 'home',
        component: Home,
        children: [
          {
            path: ':id',
            component: Disc
          },
          {
            path: 'search',
            component: Search
          }
        ]
      },

    所以我直接将代码加成了这样,导致进入  /home/search 后立即返回了。

    解决:

    1. 将search改成跟/home同级别; 将search单独写成一个路由,那么tabbar就不方便一直在选中状态了;

    2.将 子路由 :id 前面加一个前缀;这样需要改变相应的路由跳转代码;

      {
        path: '/home',
        name: 'home',
        component: Home,
        children: [
          {
            path: 'disc/:id', // 在router中就改变了这里
            component: Disc
          },
          {
            path: 'search',
            component: Search
          }
        ]
      },

     正常实现了!!

  • 相关阅读:
    0x02 枚举、模拟、递推
    0x01 位运算
    bzoj3529: [Sdoi2014]数表
    bzoj5216: [Lydsy2017省队十连测]公路建设
    POJ1789Truck History
    最小生成树模板
    POJ1258Agri-Net
    POJ1860Currency Exchange(SPFA)
    POJ3083Children of the Candy Corn
    POJ2503Babelfish
  • 原文地址:https://www.cnblogs.com/xuhua123/p/12808918.html
Copyright © 2011-2022 走看看