• react页面缓存 使用本地存储


    前面介绍了一种页面缓存的插件

    现在来说说第一种方法,仅供参考,记录的不对的可以指点指点哟。
    需求:
    开发中有从详情页返回列表页的需求,这样一来页面返回后使用react-router会直接刷新页面,导致页面中的分页和搜索条件全部丢失,用户体验不佳,所以就必须将列表页的状态进行缓存。
    解决办法:
    1.使用本地缓存localStorage
    把列表页中的状态都存在本地,然后从详情页回到列表页时,让他默认使用本地缓存中的状态,等列表页渲染完了后,做一个清除缓存的操作,这样的话,我们从别的页面进入列表页就不会使用本地缓存的状态。这种方式会存在两种弊端:
    1.回到列表页还是会拿本地的状态去后端发请求获取数据
    2.当我们回到列表页时,分页page=2,然后去增加一个搜索条件,然后向后端发送请求就会报错,因为很可能你这个搜索条件下根本不存在两页数据,这样后端就给你返回提示报错的信息
     解决第一个弊端:
    我们把列表中的状态和数据全部存在本地,等回到列表页时全部用本地的缓存数据和状态来渲染页面,如果再做其他操作就重新发请求
     解决第二个弊端:
    我们可以在搜索按钮提交的事件中把page重置为1,这样主要是搜索的话,就会默认给后端发送page=1的请求
     
  • 相关阅读:
    使用Parallel计算目录中的文件字节长度
    任务工厂
    启动新任务和子任务
    服务器端小程序
    Java核心技术II读书笔记(三)
    Java核心技术II读书笔记(二)
    Java核心技术II读书笔记(一)
    多线程-线程的中断
    http协议详解
    java UncaughtExceptionHandler 处理线程意外中止
  • 原文地址:https://www.cnblogs.com/shine1234/p/15222449.html
Copyright © 2020-2023  润新知