✨React路由动态传参，页面刷新参数丢失问题解决

最新推荐文章于 2023-07-17 11:50:16 发布

小朋友120

最新推荐文章于 2023-07-17 11:50:16 发布

阅读量2k

点赞数 1

分类专栏： react javascript 笔记文章标签： react.js

本文链接：https://blog.csdn.net/eternalyii/article/details/120748697

版权

笔记同时被 3 个专栏收录

38 篇文章 0 订阅

订阅专栏

javascript

28 篇文章 0 订阅

订阅专栏

react

15 篇文章 0 订阅

订阅专栏

本文介绍如何在React应用中使用sessionStorage来保存路由参数，确保页面刷新时参数不会丢失。通过监听history对象的state，并将其存储在sessionStorage中，可以在页面加载时恢复参数。

摘要由CSDN通过智能技术生成

~~路由传参，刷新页面参数丢失问题~~
这里的history只需要将路由里面history参数传入就可以了，采用的 sessionStorage 存储，达到页面刷新参数不丢失的一个问题。

// 解决路由传参 页面刷新丢失问题`在这里插入代码片`
export const RouteStateD = (history) => {
  let urlData;
  if (history.location.state) {
    urlData = history.location.state;
    sessionStorage.setItem('urlD', JSON.stringify(urlData));
  } else {
    urlData = JSON.parse(sessionStorage.getItem('urlD'));
  }
  return urlData;
};