使用umi的keep Alive实现详情页面的回退,保留滚筒条高度

$ npm install umi-plugin-keep-alive --save
//或者
$ yarn add umi-plugin-keep-alive

我用的umi，有的react 项目还需要个依赖包

yarn add react-activation

用法：

import { KeepAlive } from 'umi'
  <KeepAlive
        when={true} //true卸载时缓存，false卸载时不缓存
        name={'salaryGroup'}  //可按照name卸载缓存状态下的 <KeepAlive> 节点 
        saveScrollPosition="screen"> //自动保存共享屏幕容器的滚动位置
        <TableList></TableList> //包裹的组件
      </KeepAlive>

总结:根据不同场景还有不同的写法吧 ，奉上两篇参考文章：

React集成react-activation，实现页面缓存
记录react页面跳转是否要回到指定浏览位置解决方案
antd-design-pro实现多页签，切换页签保留缓存，keep-alive
umi Ant Design 使用umi-plugin-keep-alive实现KeepAlive状态存储
使用umi的keep Alive实现详情编辑页面的回退,保留列表的查询条件