路由嵌套

路由嵌套

嵌套路由是一个很常见的功能

比如在home页面中, 我们希望通过/home/news和/home/message访问一些内容.

一个路径映射一个组件, 访问这两个路径也会分别渲染两个组件.

路径和组件的关系如下:

实现嵌套路由有两个步骤:

创建对应的子组件, 并且在路由映射中配置对应的子路由.

在组件内部使用< router-view>标签.

嵌套路由实现

嵌套默认路径

嵌套路由也可以配置默认的路径, 配置方式如下:

传递参数

准备工作

为了演示传递参数, 我们这里再创建一个组件, 并且将其配置好

第一步: 创建新的组件Profile.vue

第二步: 配置路由映射

第三步: 添加跳转的< router-link>