[vue-router] Named Route 'Mine'

2021-10-26  本文已影响0人  很好就这样吧

控制台警告


翻译:
1、命名路由“Mine”具有默认子路由。当导航到此命名路由(:to=“{name:‘Mine’”)时,将不呈现默认子路由。从该路由中删除该名称,并改用命名链接的默认子路由的名称。
2、重复命名路由{ name: "MyAccount", path: "/mine/myAccount" }

{
    path: '/mine', // 个人中心
    name: 'Mine',
    component: () => import('@/views/Mine.vue'),
    children: [
      {
        path: '/',   //想要个人中心默认展示MyAccount子页面
        name: 'MyAccount',
        component: () => import('@/components/mine/MyAccount.vue'),
      },
      {
        path: 'myAccount',
        name: 'MyAccount',
        component: () => import('@/components/mine/MyAccount.vue'),
      },
      {
        path: 'myAddress',
        name: 'MyAddress',
        component: () => import('@/components/mine/MyAddress.vue'),
      }
    ]
  }

3个页面路径如下:
http://localhost:8081/mine
http://localhost:8081/mine/myAccount
http://localhost:8081/mine/myAddress

这种情况一是MyAccount出现了重复,二是默认子路由写法不对,可以改为如下

  {
    path: '/mine', // 个人中心
    name: 'Mine',
    component: () => import('@/views/Mine.vue'),
    children: [
      {
        path: '/mine', //想要个人中心默认展示MyAccount子页面
        name: 'MyAccount0',
        component: () => import('@/components/mine/MyAccount.vue'),
      },
      {
        path: '/mine/myAccount',
        name: 'MyAccount',
        component: () => import('@/components/mine/MyAccount.vue'),
      },
      {
        path: '/mine/myAddress',
        name: 'MyAddress',
        component: () => import('@/components/mine/MyAddress.vue'),
      }
    ],
  },
上一篇下一篇

猜你喜欢

热点阅读