51-Vue路由嵌套路由

如过我们想在一个路由切换中再嵌套一个路由切换,要如何做呢?这里关键问题,实现方法

效果图.gif image.png
https://router.vuejs.org/zh/guide/essentials/nested-routes.html

一.关键问题

我们对于界面上有多个路由出口,我们要指定子路由的路由出口

二.解决方法

在路由配置的时候,给需要添加子路由的路由对象添加children属性,在children对应的数组中添加子路由

三.实现方法

• 在组件中添加子路由导航和出口
• 定义子路由组件
• 在路由配置的时候给需要的路由添加子路由

• 注意:在配置子路由可以省略上一级路由/,系统会自动编译

  
  image.png
  image.png
  image.png