路由传参后，刷新会失去参数的问题

最新推荐文章于 2023-03-09 17:52:42 发布
最新推荐文章于 2023-03-09 17:52:42 发布
阅读量1.5k 收藏
点赞数
文章标签： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_44722972/article/details/106643096
版权

在路由传参时，刷新会失去参数，最后使用query传参的方式使参数不丢失，也可以通过储存在sessionStorage中解决。

1.例如我想查看文章，在点击文章后，我们就需要将文章相关的内容通过路由传入具体文章的模板中，这时候我们要使用query传参才能让文章在刷新后不会消失。

2.文章点击后触发函数跳转路由

//item就是要传入的参数
<div @click="toArticel(item)"></div>

3.通过push方法跳转到articleDetail，并传入三个参数

toArticel(item)
最低0.47元/天 解锁文章
火灬户
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
flutter动态路由配置
flutter 安卓按返回键回到手机桌面，不退出app
06-16 1175
flutter动态路由配置 代码如下 参考vue route 1.页面1 class Page extends StatefulWidget { final RouteArgsEntity args; Page({Key key, this.args}) : super(key: key); @override _PageState createState() => n...
详解React-Router中Url参数改变页面不刷新的解决办法
08-27
主要介绍了详解React-Router中Url参数改变页面不刷新的解决办法，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
Vue Router 的params和query传参刷新后参数丢失情况
Songywaa的博客
11-17 5416
开发中遇到刷新页面参数丢失的情况 params是路由的一部分，创建路由时，须要在路由后边添加参数名。 query是拼接在URL后边的参数，创建路由时，不用必须添加，可以直接跳转的时候携带即可 params 参数丢失情况： params 传参需要在路由后边添加参数名，例如：/:id/:name，如果在路由中没配置参数，当页面刷新之后，所传参数就会消失 如果在路由中配置了参数，例如： /:id/...
next.js中url参数在页面刷新后获取不到问题的解决方案
玖尘的博客
01-12 1292
next.js中url参数在页面刷新后获取不到问题的解决方案
Vue------关于路由传参刷新丢失的问题(最全方法)~~~
COCOLI_BK的博客
03-19 1385
传参方式 技术点 缺点 通过路由params传参 params 用于组件传递，params刷新页面数据会丢失。 通过路由query传参 query params和query，params传值刷新页面是要消失的，然而query却不会，两者的区别就在于query会把传递的参数显示在url地址中 通过vuex vuex 通过vuex来存和取你的数据，把你的数据都存在vuex中，然后那个组件需要，直接调用vu
路由传参页面刷新丢失数据
qq_53926905的博客
08-30 606
路由传参刷新页面数据丢失
vue路由传参页面刷新参数丢失问题解决方案
10-16
在上述方法中，**Query传参**是解决页面刷新参数丢失问题的最佳方案。这是因为查询参数会保留在URL中，因此在刷新页面后仍然可以访问。然而，如果数据敏感或者不希望在URL中显示，这可能不是最佳选择。 除了Vue ...
vue动态路由配置及路由传参的方式
12-10
　当我们很多个页面或者组件都要被很多次重复利用的时候，我们的路由都指向同一个组件，这时候从不同组件进入一个”共用”的组件，并且还要传参数，渲染不同的数据 　这就要用到动态路由跟路由传参了！ 首先我们来...
vue路由传参 vue路由传参
11-18
vue路由传参 vue路由传参 vue路由传参 vue路由传参 vue路由传参 vue路由传参 vue路由传参 vue路由传参 vue路由传参 vue路由传参 vue路由传参 vue路由传参 vue路由传参 vue路由传参 vue路由传参
vue-router路由参数刷新消失的问题解决方法
08-30
vue-router路由参数刷新消失的问题解决方法 路由参数刷新消失的问题解决方法是 vue-router 中常见的问题，本篇文章将为您提供四种解决方案。 解决方案一：Session & 服务器渲染 传统的解决方案是使用 Session 和...
如何解决Link组件设置target后，页面跳转后，state和query中的参数失效
my_wings的博客
05-08 2988
失效的情况： <Link to={{pathname:'/gui/collection',query:{databaseName:item.name}}} target="_blank"> 查询 </Link> 解决方案： <Link to={{pathname:`/gui/collection?databaseName=${item.name}`}...
页面刷新query和params参数丢失问题原因
weixin_49022197的博客
05-23 1106
页面刷新,query和params参数丢失问题原因 概念-路由对象属性 $route.query 一个 key/value 对象，表示 URL 查询参数。 $route.path 字符串，对应当前路由的路径 $route.fullPath 完成解析后的 URL，包含查询参数和 hash 的完整路径。 分析 当浏览器刷新时，触
路由传参——刷新页面会数据丢失
qq_50276105的博客
03-06 1817
但是用到this.$route.query.ObjectData的页面，刷新后会导致this.$route.query.ObjectData数据丢失。【2】传递对象，或者含有对象的数组，在传之前先把数据转换成字符串再进行传递--》JSON.stringify()，获取的时候把字符串转换成对象--》JSON.parse()当index页面刷新之后，再打印 this.$route.query.ObjectData，会得到一个[Object Object] 未知数据，导致报错！
【路由带参跳转】解决带参跳转到别的页面然后刷新页面参数就会丢失问题
丁东的博客
03-09 1116
参数并没有丢失，只是无法解析了，接下来说一下解决方法。可以看到获取到得参数变成了。
Vue路由传参当传参后刷新导致参数消失问题处理
typhoonpython的博客
04-28 2213
在实际项目中使用字符串拼接，使用iframe跳转链接进行报表展示。 路由传参的时候出现刷新参数丢失问题，具体解决如下： 在进行路由配置的时候使用如下设置进行的配置，用的params方法进行参数传递。 { path: 'data-detail-edit/:type', component: () => import('@/views/cost/costDetail/index'), name: 'test1' params: { type: 1 }, me
vue路由传参刷新丢失
gys9895的博客
06-29 4321
543534354
✨React路由动态传参，页面刷新参数丢失 问题解决
在人生道路上谦让三分，就能天宽地阔。
10-13 1940
路由传参，刷新页面参数丢失问题 这里的history只需要将路由里面history参数 传入就可以了，采用的 sessionStorage 存储，达到页面刷新参数不丢失的一个问题。 // 解决路由传参 页面刷新丢失问题`在这里插入代码片` export const RouteStateD = (history) => { let urlData; if (history.location.state) { urlData = history.location.state; se
解决react路由跳转传参刷新页面后参数丢失问题
weixin_43954835的博客
04-14 8179
import { useHistory } from 'react-router-dom'; const history = useHistory(); history.push({ pathname: '/details', state: { name: name, id: id, }, }); 在history中使用state确实可以传参数，在进入页面时可以正常显示，但是在刷新页面后state里面的数据会清空，页面就无法正常显示。.
vue路由携带参数刷新页面，参数数据消失问题（query，params）
Eleuuuuy的博客
02-09 3800
1.刷新页面后丢失携带参数，但是参数在url中不显示 this.$router.push({ name:'page', params:{ param1:this.param1 } }) 接收参数时用 this.$route.params.param1 2.刷新页面后保留参数，但是参数在url中显示 //但是，携带参数时用query，跳转后，url上会拼接参数，刷新页面后参数不会丢失，依然是那个带参数的url this.$router.push({ name: "page1", query
vue路由传参刷新页面参数丢失
最新发布
03-28
在 Vue 路由传参时，如果刷新页面参数丢失，有以下几种可能的原因： 1. 参数没有在路由配置中声明 如果你使用的是动态路由参数，例如 `/user/:id`，那么在路由配置中需要声明这个参数，否则在刷新页面时，参数会被...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值