前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >表格,列表末尾数据删除后分页回退的处理

表格,列表末尾数据删除后分页回退的处理

作者头像
copy_left
发布2022-12-18 18:05:16
5290
发布2022-12-18 18:05:16
举报
文章被收录于专栏:方球方球

对于表格,列表末尾数据可删除时,存在删除后刷新数据,当前分页下无数据的问题。 这里需要对几种状态条件做处理:

  1. 删除后数据当前分页数据不为空
  2. 删除后数据当前分页数据为空,分页号不为1 即只剩最后一页
  3. 删除后数据当前分页数据为空,分页号为1

状况1和状态3: 直接刷新当前分页数据 状态2:需要获取前一页数据

所以处理的方式主要是对三种状态的判断和对应的分页号计算,注:这里可能存在删除一条或多条(批量删除)

实现

代码语言:javascript
复制
/**
 * 列表删除最后当前分页是否为空,是否需要计算刷新的分页号
 * @summary
 * 通过total, pageSize 计算是否为第一页
 * listOrLength, deleteLength 判断删除数据后
 */
export default function deleteLastPage (options) {
  const {
    pageNum,
    total,
    pageSize,
    listOrLength,
    deleteLength = 1
  } = options

  const totalPage = Math.ceil(total / pageSize)

  const currentListLength = Array.isArray(listOrLength) ? listOrLength.length : listOrLength
  // 判断是否删除末尾数据, 即: 末尾页的最后一条数据
  const isLast = currentListLength <= deleteLength && (totalPage === pageNum)

  if (!isLast) {
    return pageNum
  }

  // const prePageNum = pageNum - 1
  // if (prePageNum >= 1) {
  //   return prePageNum
  // }
  // return 1

  // 与上面 prePageNum 获取的等价算法
  return [pageNum - 1, 1].sort((a, b) => a - b)[1]
}
本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2022-12-16,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 实现
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档