Skip to content

命名路由

创建路由时,可以给路由指定一个名字

javascript
const routes = [
  {
    path: '/user/:userId',
    name: 'user',
    component: User,
  },
]

然后我们可以使用 name 而不是 path 来传递 to 属性给 <router-link>

html
<router-link :to="{ name: 'user', params: { userId: 123 }}">User</router-link>

上述示例将创建一个指向 /user/123 的链接。

使用name有很多优点:

  • 没有硬编码的 URL
  • params的自动解码/编码
  • 避免使用相对路径时出现路径错误
  • 绕过路径排序,例如展示一个匹配相同路径但排序较低的路由。

TIP
所有路由的命名必须是唯一的。如果为多条路由添加相同的命名,路由器只会保留最后那一条。