更新时间:2022-02-09 来源:黑马程序员 浏览量:
是否是嵌套路由主要是由页面结构来决定的,实际项目中的应用界面,通常由多层嵌套的组件组合而成。简而言之,嵌套路由就是在路由里面嵌套它的子路由。
嵌套子路由的关键属性是children,children也是一组路由,相当于前面讲到的routes,children可以像routes一样地去配直路由数组。每一个子路由里面可以嵌套多个组件。子组件又有路由导航和路由容器,示例代码如下:
<router-link to="/父路由的地址/要去的子路由"></router-link>
当使用children属性实现子路由时,子路由的path属性前不要带“/“,否则会永远以根路径开始请求,这样不方便用户去理解URL地址。
下面我们通过代码演示一个简单的嵌套路由的配置,具体代码如下:
var router = new VueRouter({ routes: [ { path: '/home' , component: home, children: [ { path: 'loain', component: login }, { path: 'register', component: register } ] } ] })
在上述代码中,第3~10行配置的是外层路由,第6~9行配置的是子路由。
【AI设计】北京143期毕业仅36天,全员拿下高薪offer!黑马AI设计连续6期100%高薪就业
2025-09-19【跨境电商运营】深圳跨境电商运营毕业22个工作日,就业率91%+,最高薪资达13500元
2025-09-19【AI运维】郑州运维1期就业班,毕业14个工作日,班级93%同学已拿到Offer, 一线均薪资 1W+
2025-09-19【AI鸿蒙开发】上海校区AI鸿蒙开发4期5期,距离毕业21天,就业率91%,平均薪资14046元
2025-09-19【AI大模型开发-Python】毕业33个工作日,就业率已达到94.55%,班均薪资20763元
2025-09-19【AI智能应用开发-Java】毕业5个工作日就业率98.18%,最高薪资 17.5k*13薪,全班平均薪资9244元
2025-09-19