Vue 路由params传参在刷新之后可能不存在的问题分析

​最近，在写Vue项目的时候，遇到一个问题：首先我访问详情，然后给详情页面创建匹配路由路由匹配如下：

然后我通过router-link访问：

这没问题，但是，如果我需要在详情页面编辑部分内容（这里我的详情和编辑是同一个页面），然后就有了场景区分，一种是纯详情访问，这种情况下我需要禁用表单的编辑功能，另一种是带有编辑的详情，需要开放表单的编辑。

我们知道，Vue的路由可以通过params和query传参，所以首先我想到的是用路由的params传参，因为我已经传递了id参数，再加一个理所当然吧

进入详情页面之后，也可以拿到type，然后区分场景

但我无意中刷新了下页面，哎，问题来了，我type没了。。。一开始我还没很懵逼，这是什么情况，咋突然不对了，然后我反复试了几次之后，发现刷新之后，没有在路由中匹配的params参数就会丢失，好了们既然找到原因了，哪有什么解决方案呢

前面不是说过，路由传参有两种方式，所以我们可以通过query传递参数

接着，我尝试的刷新，反复刷，没问题。

总结下：Vue页面之间传递参数可以通过路由的params和query传递参数，params的话，参数可以不在URL中出现（如果没在路由中注册的话），弊端是刷新的话，不在URL中出现的参数都会丢失，query就是查询参数，刷新不会丢失，缺点是会在URL中以查询字符串的形式展示，可能不利于敏感数据展示。另外，百度还有另外一种解决方案，通过本地存储的方式（storage、cookie），但本人因场景出现较多，使用此方式会增加额外的工作量，故，并未尝试。