关于ANTD分页查询最后一页最后一条删除不会往前回退一页

280 阅读1分钟
<Popconfirm
  key="delete"
  title={`确认要删除『${record.name}』渠道么?`}
  onConfirm={async () => {
    const success = await handleRemove(record.id);
    handleChannelData();
    if (success) {
      //为了解决antd没有做好的分页问题
      const a =
        actionRef.current!.pageInfo!.total % actionRef.current!.pageInfo!.pageSize;
      if (a === 1) {
        //源代码 就是如果是第一页最后一条数据current就变成0了,说不定会报错,所以在他等于0的时候把他变成1
        //actionRef.current!.pageInfo!.current - 1 === 0 ? 1 : actionRef.current!.pageInfo!.current - 1
        actionRef.current?.setPageInfo?.({
          current: Math.max(actionRef.current!.pageInfo!.current - 1, 1),
        });
      } else {
        actionRef.current?.reload();
      }
    }
  }}
>

这是ANTD PRO的Popconfirm组件最关键的代码 别的组件也能用这个代码 这个actionRef是Protable的组件对象

const a =
  actionRef.current!.pageInfo!.total % actionRef.current!.pageInfo!.pageSize;
if (a === 1) {
  //源代码 就是如果是第一页最后一条数据current就变成0了,说不定会报错,所以在他等于0的时候把他变成1
  //actionRef.current!.pageInfo!.current - 1 === 0 ? 1 : actionRef.current!.pageInfo!.current - 1
  actionRef.current?.setPageInfo?.({
    current: Math.max(actionRef.current!.pageInfo!.current - 1, 1),
  });
} else {
  actionRef.current?.reload();
}

主要运用了ANTDPRO的pageInfo获取页面的条数总数和每页数量 在调用setPageInfo里面的current进行页面回退跳转