关于 vue路由初识（子路由）

今天学习了简单的路由，和children  子路由的用法，大致可以总结为，假如我们在做一个带有底部导航的移动端项目可以这样写

routes: [
    {
      path: '/',
      name: 'home',
      redirect: '/index',
      component: () => import(
        '@/sgw/home'
      ),
      // 首页底部导航路由注册
      children: [
        {
          path: '/index',
          name: 'index',
          component: () => import(
            '@/sgw/index'
          )
        },
        {
          path: '/active',
          name: 'active',
          component: () => import(
            '@/sgw/active'
          )
        },
        {
          path: '/mall',
          name: 'mall',
          component: () => import(
            '@/sgw/mall'
          )
        },
        {
          path: '/mine',
          name: 'regmineed',
          component: () => import(
            '@/sgw/mine'
          )
        }
      ],
    },

其中path为‘/’的为根目录，下面用了children 是因为在跳转路由一级页时，底部导航需要一直存在，所以可以采用路由挂载的方式，在‘/’这个页面中 加入<router-view></router-view>，底部导航也写在这个页。这样的话 在跳转时底部导航就会一直存在，

但是当我们跳转二级页时底部导航不需要了怎么办呢，这个时候需要注册路由的时候和上面的path同级创建。底部导航自然就不会在跳转路由的时候加载了

 routes: [
    {
      path: '/',
      name: 'home',
      redirect: '/index',
      component: () => import(
        '@/sgw/home'
      ),
      // 首页底部导航路由注册
      children: [
        {
          path: '/index',
          name: 'index',
          component: () => import(
            '@/sgw/index'
          )
        },
        {
          path: '/active',
          name: 'active',
          component: () => import(
            '@/sgw/active'
          )
        },
        {
          path: '/mall',
          name: 'mall',
          component: () => import(
            '@/sgw/mall'
          )
        },
        {
          path: '/mine',
          name: 'regmineed',
          component: () => import(
            '@/sgw/mine'
          )
        }
      ],
    },
    // 我的二级页
    {
      path: '/mine/mine_reged',
      name: 'reged',
      component: () => import(
        '@/sgw/mine_reged'
      )
    }

记录到这里，如果有大佬发现问题请一定要指正我，新手上路感恩。