路由器链接到带有参数的路径

Question

我正在尝试使用

vue-router

转到我的

vue

app 中的 UserDetail 路径。

我的路线是：

const routes = [
  { path: '/users', component: UserList },
  { path: '/users/:user_id', component: UserDetail },
  { path: '/bar', component: Bar }
]

和路由器链接：

    <td><router-link :to = "{ path: 'users/:user_id', params: {user_id: user.id}} ">{{user.name}}</router-link></td>  

但这显然不是正确的语法。我通常使用命名路由（例如，参见https://router.vuejs.org/en/api/router-link.html）来处理此类内容，但我如何使用路径？

编辑#1

将鼠标悬停在其中一个链接上：

Answer 1

解决方案很简单。就像router-link docs所说的那样：

<td>
  <router-link :to="{ name:'users', params: { user_id: user.id }}">
    {{user.name}}
  </router-link>
</td>

如果你想像这样传递参数，你应该在

name

内使用

path

而不是

:to

。