在 React 中页面重新加载时怎样保留数据?

243 阅读1分钟
  • Redux:将页面的数据存储在 redux 中,在重新加载页面时,获取 Redux 中的数据;
  • data.js:使用 webpack 构建的项目,可以建一个文件,data.js,将数据保存 data.js 中,跳转页面后获取;
  • sessionStorge:在进入选择地址页面之前,componentWillUnMount 的时候,将数据存储到sessionStorage 中,每次进入页面判断 sessionStorage 中有没有存储的那个值,有,则读取渲染数据;没有,则说明数据是初始化的状态。返回或进入除了选择地址以外的页面,清掉存储的 sessionStorage,保证下次进入是初始化的数据
  • history API:History API 的 pushState 函数可以给历史记录关联一个任意的可序列化 state,所以可以在路由 push 的时候将当前页面的一些信息存到 state 中,下次返回到这个页面的时候就能从state 里面取出离开前的数据重新渲染。react-router 直接可以支持。这个方法适合一些需要临时存储的场景。