vue 路由 每次都带参数

对于 Vue 路由来说，带参数可以通过两种方式实现：

1. 路由路径中添加参数

通过在路由路径中添加参数来传递参数，例如：

const router = new VueRouter({
  routes: [
    {
      path: '/user/:userId',
      name: 'User',
      component: User
    }
  ]
})

在路由路径中定义了一个 userId 参数，可以通过以下方式访问：

this.$router.push({ name: 'User', params: { userId: 123 }})

也可以在路由地址栏中直接输入 `http://localhost:8080/user/123` 来访问这个路由。

2. 查询字符串中添加参数

通过在查询字符串中添加参数来传递参数，例如：

const router = new VueRouter({
  routes: [
    {
      path: '/user',
      name: 'User',
      component: User
    }
  ]
})

在路由路径中定义了一个 userId 参数，可以通过以下方式访问：

this.$router.push({ name: 'User', query: { userId: 123 }})

也可以在路由地址栏中直接输入 `http://localhost:8080/user?userId=123` 来访问这个路由。

如果需要每次都带上参数，可以在组件中使用路由的 `beforeRouteEnter` 钩子函数来实现，例如：

export default {
  // ...
  beforeRouteEnter (to, from, next) {
    next(vm => {
      vm.$router.replace({ name: 'User', query: { userId: 123 }})
    })
  }
}