ant design pro,删除最后一页退回上一页

短命女 2022-12-30 03:45 255阅读 0赞

**首先需要三个变量，分别是删除后的总数以及页码还有每页条数：**

var nowDatasSize: number = -1
    
    var currentPage: number = 1;
    
    var pageSize: number = 10

**在分页属性中加上页码变化以及每页显示条数变化的回调：**

pagination={ { 
              pageSize: 10,
              showTotal: total => {  return <span>共 <span className="pagination">{ total}</span> 条</span> },
              onChange: (current, size) => { 
                currentPage = current
                if (size != undefined) { 
                  pageSize = size
                }
              },
              onShowSizeChange: (current, size) => { 
                currentPage = 1
                if (size != undefined) { 
                  pageSize = size
                }
              }
            }}

**请求参数判断当前页删除后还是否有数据：**

if (nowDatasSize != -1 && currentPage > Math.ceil(nowDatasSize / pageSize)) { 
          currentPage = Math.ceil(nowDatasSize / pageSize)
        }

**在参数中添加对应的页码以及每页显示条数：**

params["current"] = currentPage
        params["pageSize"] = pageSize

**在返回参数中获取当前的总条数：**

return dispatch({ 
          type: 'blindPlateManage/findBlindPlates',
          payload: params
        }).then(async (res: any) => { 
          await initEnum()
          nowDatasSize = res?.total
          return res
        })

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM5ODk4MTkx_size_16_color_FFFFFF_t_70]

**最后，每次删除操作时需要计算删除后还剩多少条数据量：**

nowDatasSize = nowDatasSize - selectedRowsState.length

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM5ODk4MTkx_size_16_color_FFFFFF_t_70 1]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM5ODk4MTkx_size_16_color_FFFFFF_t_70]: /images/20221120/a098edbe7fac4ae6a1ee0905dbbbc7e3.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM5ODk4MTkx_size_16_color_FFFFFF_t_70 1]: /images/20221120/ee6f93b3a1844e868f33408cc721d797.png