码迷,mamicode.com
首页 > 其他好文 > 详细

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

时间:2019-10-31 23:43:52      阅读:241      评论:0      收藏:0      [点我收藏+]

标签:页面   基于   ref   其他   导致   问题:   ram   url   就是   

问题:在最近的项目中,我通过传递不同的参数,复用同一组件进行渲染,然而意外出现一个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请求或者其他操作就会失败

 

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

标签:页面   基于   ref   其他   导致   问题:   ram   url   就是   

原文地址:https://www.cnblogs.com/flypig666/p/11774485.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!