vue动态路由传参params
时间: 2023-11-09 17:05:05 浏览: 117
vue路由传参 vue路由传参
5星 · 资源好评率100%
在Vue中,动态路由传参可以使用params进行传递。当使用params参数进行传参时,参数不会在网址栏显示,而是被包含在路由中。这种传参方式通常配合组件路由的name使用。在router.js中定义路由时,可以为每个路由定义一个name属性,然后在通过<router-link>或者编程式导航时,使用name和params参数来传递动态参数。
举个例子,假设有一个路由定义如下:
{
path: '/user/:id',
name: 'user',
component: User
}
在使用<router-link>时,可以这样传递参数:
<router-link :to="{ name: 'user', params: { id: 123 }}">User</router-link>
或者使用编程式导航的方式:
this.$router.push({ name: 'user', params: { id: 123 } })
以上两种方式都会将参数id的值设置为123,并传递给名为user的路由。
阅读全文