命名路由

前面的代码中，在 routes 中配置的路由，我们一般以 path 进行区分，不同的 path 表示不同的路由。除了 path 之外，还可以为任何路由提供 name，这有以下优点：

  • 没有硬编码的 URL。

  • params 的自动编码/解码。

  • 防止用户在 URL 中出现打字错误。

  • 绕过路径排序（如显示一个）。

命名路由的主要含义是给路由设置一个 name 属性，同时提供 params 参数可以让路由之间切换时，传递更加复杂的数据，同时如果配置了 name，则需要保证不同路由的 name 不同，如示例代码7-7-1所示。

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

配置了 name 属性后，后续在进行路由切换时，就可以传递复杂参数，代码如下：

<router-link :to="{ name: 'user', params: {username: 'erina'}}">
User
</router-link>

params 参数可以传递复杂对象，后面也可以采用编程式导航来实现页面切换。