react做管理后台项目遇到的问题和难点

2,442 阅读1分钟

用react做管理后台项目,总结了自己的一点点感悟

1.全选翻页问题

使用场景:对一个table列表数据进行操作, 将选中的数据加到另一个列表中, 并可以对源列表进行全选和查询操作
问题描述:当使用全选功能, 对数据进行翻页, 会导致原来选中的数据被清空, 原因是antd的全选按钮, 只选择到了当前页的数据, 当切换之后又是另一页数据了

解决方案一: 将列表数据变成二维数组, 实现多页操作, 并将数据扁平化之后加到需要添加进去的列表中
虽然能实现基本需求, 但仍然存在问题, 查询之后会删除被选择的值, 原因是翻页问题导致.查询时当前一般只有一页,选中之后按页码来增删数据,当前查询数据会覆盖原来的第一页数据
解决方案二: 穿梭框方案

总结: 使用穿梭框基本上就实现了业务需求, 但由于没有分页功能, 数据加载可能会相对有影响,如果之后有更好的方式,再补上.