主题： react + antd 实现页面缓存
关于页面缓存：
Vue
- keepAlive 简洁好用，就是和 react 没关系
React
常规方法
- localstorage、sessionStorage 繁琐、不易维护。单一条件页面联动少时可使用。
- 通过 store 将页面数据缓存下来，或缓存下这个页面查询条件，再次切回去，把 store 数据重新注入。这种方式改动大、代码量大、不易维护，收益比不高，一般不使用。
发现新大陆
- react-keepalive-router 插件，react 的 keepalive，缓存很方便。
应用场景
例：用户进入路由页面，当前路由页由 form 表单和 table 组成，在表单内输入查询条件时 table 展示所有符合条件的数据，当切换路由再次回到该路由页时会发现刚刚搜索的数据没了，页面数据恢复到刚进入页面时的初始全量状态，想要查看刚才的数据需重新搜索，交互感十分不好。使用 react-keepalive-router 能很好的解决该问题，使用户返回上一个路由页时页面信息保持离开前的状态。
使用方法
下载
- npm/cnpm install react-keepalive-router --save 或
- yarn add react-keepalive-router
基本用法
- import { keepaliveRouterSwitch, KeepaliveRouter } from 'react-keepalive-router';
- 图片示例
注：
- KeepaliveRouter 如果没有被 keepaliveRouterSwitch 包裹就会失去缓存作用。
- 不是开发者，只是使用者，附：源码地址
