vue3页面跳转带参数

在Vue3中，可以使用`router.push`方法进行页面跳转，并使用`params`选项传递参数。

以下是一个示例：

1. 在路由定义中设置参数名：

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

在这个例子中，`:userId`表明这是一个动态参数，可以在跳转时传递具体的值。

2. 在组件中使用`$route.params`获取参数值：

<template>
  <div>
    {{ $route.params.userId }}
  </div>
</template>

3. 在代码中实现页面跳转并传递参数：

// 在方法中调用
this.$router.push('/user/123')

// 或者使用命名路由
this.$router.push({ name: 'User', params: { userId: 123 }})

在这个例子中，以字符串形式传递参数时需要将参数名（`userId`）和参数值（`123`）拼接到URL中，并以斜杠（`/`）作为分隔符。

使用命名路由时，可以将参数作为`params`选项传递。这样做的好处是可以不必记住具体的URL格式，而可以直接使用名称来表示路由。例如，可以将URL中的`/user/123`改为`/user/:userId`，这样可以使URL更加简洁和易于管理。