vue-router 路由嵌套

//http://localhost:8080/#/home/news
{   
	path:'/home',  
	component:Home,   
	children:[
    {
      path:'news', // 此处不加'/'
      component:HomeNews,
    }  
     ] 
}

配置嵌套路由

{
    path:'/about',      //一级路由
    component:About,
    children:[          
      {                      //二级路由
        path:'/',            //二级的默认路由(此path指向上一级,即path:'/about')
        name:'expressLink',        
        component:Express      
      },
      {
        path:'/about/guide',
        name:'guideLink',
        component:Guide
      },
      {
        path:'/about/contact',
        name:'contactLink',
        component:Contact,
        children:[            
          {                                     //三级路由
            path:'/about/contact/personName',
            name:'personNameLink',
            component:PersonName,
          },
          {
            path:'/about/contact/phone',
            name:'phoneLink',
            component:Phone
          },
 
        ]
      }
    ]
  },
发布了60 篇原创文章 · 获赞 15 · 访问量 1万+

猜你喜欢

转载自blog.csdn.net/qq_44317018/article/details/105659193
今日推荐