vue:解决使用param传参后，再次刷新页面会新增一个原有的tab

Posted 2020-12-01 小飞猪咯咯

问题：在最近的项目中，我通过传递不同的参数，复用同一组件进行渲染，然而意外出现一个bug，就是当我重新刷新该页面时，会新增一个tab

原来的：

 

刷新页面后：

 

 

 

查阅资料后，发现该现象是由于通过params进行传递的参数引起的，params进行传参后再次刷新页面，参数丢失，导致fullpath不一致，从而新增了页面（而我使用的d2admin基于element-ui第三方框架）

解决方案：将params方式传参改为使用query传参，这样参数就不会因为刷新而丢失

参考：

https://juejin.im/post/5c139fed6fb9a049ab0d80dc

query和params传参的区别？

• query 传参配置的是path，而params传参配置的是name，在params中配置path无效
• query在路由配置不需要设置参数，而params必须设置
• query传递的参数会显示在地址栏中
• params传参刷新会无效，但是query会保存传递过来的值，刷新不变 ;

 如果路由上面不写参数，也是可以传过去的，但不会在url上面显示出你的参数，并且当你跳到别的页面或者刷新页面的时候参数会丢失，那依赖这个参数的http请求或者其他操作就会失败