vue路由传参能否不将参数显示在地址栏？

这算是一个常见的需求，也是一个常见的面试题，我们通常这么做：

// route
{
  path: '/somewhere',
  name: 'somewhere'
}

// 传参
router.push({ name: 'somewhere', params: { oops: 'gets removed' } })

// 获取参数
this.$route.params.oops

但这实际上是一种路由反模式, 并且已经存在很长一段时间, 其反模式体现之一就是刷新后会丢失参数.

在vue-router的4.1.4版本中已弃用上述写法, 如果继续使用将抛出警告, 并且无法获取参数.

同时, 也给出了替代方案:

1. 将参数存储在pinia等状态管理库中
2. 如果数据并非那么私密, 遵循最佳实践应将参数显示在地址栏上, 比如基于url的状态
3. 将数据存储于history.state中
4. 数据如果来自函数、网络等，则可在导航守卫中获取数据，并将数据作为新属性传递给to.mate

more: github.com/vuejs/route…