【删除列表中最后一条数据遇到的问题】

2023-11-11

项目场景:

列表有多页数据,如果最后一页只有一条数据,当删除这条数据时,页码能够改变并且数据正确展示。
在这里插入图片描述


问题描述

当删除这条数据时,页码可以正确展示,但是数据没有正确显示
在这里插入图片描述

handleDelete(row) {
      const id = row.userId;
      this.$confirm(
        '是否确认删除学号为"' + row.userName + '"的数据项?',
        '警告',
        {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }
      )
        .then(function() {
          return delStudent(id);
        })
        .then(() => {
          this.msgSuccess('删除成功');
          this.getList();
        });
    },

原因分析:

删除某页码最后一条数据后重新请求列表数据时传入的页码应该是某页码减一

当前页是第九页(pageCurrent:9),删除第九页最后一条数据之后,请求列表传入的页码应该是第八页(pageCurrent:8)


解决方案:

当删除数据之后,计算出总页码数,如果当前页码大于总页码,那么让当前页码等于总页码,否则当前页码不变;

注意:当数据总数正好是一条时,得到的总页码数是0;但是请求列表页码不得小于1,所以当当前页码是0时,让其页码等于1

handleDelete(row) {
      const id = row.userId;
      this.$confirm(
        '是否确认删除学号为"' + row.userName + '"的数据项?',
        '警告',
        {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }
      )
        .then(function() {
          return delStudent(id);
        })
        .then(() => {
        let totalPage = Math.ceil(
            (this.total - 1) / this.queryParams.pageSize
          );
          let currentPage =
            this.queryParams.pageCurrent > totalPage
              ? totalPage
              : this.queryParams.pageCurrent;
          this.queryParams.pageCurrent = currentPage < 1 ? 1 :currentPage;//notice!!!!
          this.msgSuccess('删除成功');
          this.getList();
        });
    },

项目疑问:

删除数据时为什么页码显示正确,但是实际上请求列表参数不对?


分页显示使用的是ElementUi组件pagination,当删除数据后没有进行处理时,返回的总数据数是正确的,pagination会自动识别然后显示在最后一页。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

【删除列表中最后一条数据遇到的问题】 的相关文章

随机推荐

  • docker镜像的导出与导入

    内网干活的忧桑大概就是偷点懒 使用docker镜像 dockerfile中使用的镜像内网中却没法down下来 so 找个外网机 先把需要的镜像下载下来 再将下载好的镜像载入到内网机 通过查资料 docker镜像的导入导出命令有save lo
  • 前端组件Bootstrap4(学习笔记一)

    Hello 大家好 今天要分享的文章仍然是关于前端的 为什么迟迟没有关于Android相关的文章呢 其实这个公众号一开始 我就有明确的表示 它不仅仅局限于Android 我希望它可以博采众长 以Android为主 其它技术为辅 夹杂一些社会
  • Unity3D之UI按键绑定事件案例(七)

    七 多个按键事件存在的时候怎么区分 怎么同时绑定事件 下面的案例可以给出答案 第一步 通过Hierarchy面板创建多个button 第二步 创建一个名为Buttons的脚本 代码如下 public class MyEventArgs pu
  • web前端可视化开发,前端优秀实践指南,知乎上已获万赞

    前言 跳槽 这在 IT 互联网圈是非常普遍的 也是让自己升职加薪 走上人生巅峰的重要方式 那么作为一个普通的Android程序猿 我们如何才能斩获大厂offer 呢 疫情向好 面试在即 还在迷茫踌躇中的后浪们 如何才能在面试中让自己脱颖而出
  • Qt自定义控件 —— 颜色选择组合控件

    在开始阅读本文之前 如果您有学习创建Qt自定义控件并在其他项目中引用的需求 请参考 Linux系统下在Qt Creator中创建自定义控件并在其他项目中引用https blog csdn net YMGogre article detail
  • head 请求了解过吗?如何用 get 模拟 head 请求?不需要服务器返回数据,怎么实现?

    HEAD请求是HTTP 1 1协议中定义的一个请求方法 与GET请求相似 但只请求目标URL的头部 不请求实际的数据或者说正文内容 其主要用途是 检查资源是否被修改 检查资源是否存在 校验缓存有效性 了解服务器性能 要用GET请求模拟HEA
  • [已解决]“ImportError: No module named flask”

    1 删除原有的用大写开头的Flask插件 pip uninstall Flask 2 yum安装 flask yum install python flask 3 等待安装完成就可以允许程序啦 100 有用
  • 快速编写json数据

    1 打开idea 2 新建txt文件 alt 单击快速加 编写json数据
  • C语言面试必问的经典问题(纯”gan“货)

    C语言面试必问的经典问题 1 预处理 1 预编译 编译过程最先做的工作是啥 何时需要预编译 指令有什么 答 预编译就是预处理 就是把一些文本的替换工作工作 预编译指令 include ifdef ifndef else endif 编译 字
  • 高德地图Js API的使用

    申请JSAPI的开发者key 申请地址 http lbs amap com dev key 引入高德地图JavaScript API文件 创建地图容器 在页面body里你想展示地图的地方创建一个div 容器 并指定id标识 div div
  • Python-Pyqt6之QIntValidator,QDoubleValidator无法限制数值范围的正则表达式解决方案

    在使用Pyqt6进行GUI设计的时候 在需要输入数值 整型 浮点型 的时候选择使用了QLineEdit这个组件控件 详情介绍 QLineEdit组件详情 QLineEdit自带的setValidator包含 QIntValidator QD
  • promise函数几种写法与坑

    promise是ES6中引入的处理异步函数的强大特性 但是对promise的不恰当使用可能会达不到最终目的 对这个问题的探究来源于这篇文章关于promises 你理解了多少 几个异步函数如下 resolve或reject在回调函数里被调用
  • 网络编程的几种I/O模式

    1 非阻塞I O 非阻塞I O 若想网络编程时调用I O函数不想让程序阻塞 需要使用I O复用技术 一个方法是poll 轮询 所谓轮询就是执行函数时 如果内核不能立即对应用的函数进行响应时 就返回给应用一个错误 而应用不停的循环调用该函数
  • JavaScript表示不背小数计算存在误差的锅

    浮点数的最高精度是17位小数 但是在实际计算时会产生莫名其妙的问题 如0 1 0 2的结果不是0 3 而是0 30000000000000004 这个舍入误差会导致无法测试特定的浮点数值 例如 var a 0 1 b 0 2 if a b
  • 【数据结构】采用邻接矩阵表示法创建无向网、无向图、有向图、有向网

    提示 文章写完后 目录可以自动生成 如何生成可参考右边的帮助文档 目录 一 无向网 权值 对称 1 思路 2 代码 3 运行结果 三 其他 1 无向图 0 1 对称 2 有向网 权值 不对称 3 有向图 0 1 不对称 一 无向网 1 思路
  • 使用python的pandas包查询数据库数据导出到excel

    文章目录 前言 1 实现分析 2 实现过程 2 1安装环境 2 3功能逻辑 2 4完整代码 3 总结 前言 前几天接到一个业务的需求 让我把当前数据库里面的结果数据导出到excel中 然后供业务查看 问题是当前结果数据都是列式表 所以需要把
  • 强化学习 reward 曲线的绘制

    每隔一段取一个均值 然后把均值曲线绘制出来 包含全部点的曲线淡化处理 摘自 Z Mou Y Zhang F Gao H Wang T Zhang and Z Han Deep Reinforcement Learning based Thr
  • paddlepaddle安装问题protobuf package to 3.20.x or lower.

    按照官方文档安装paddlepaddle 2 3 0后 进行环境验证时 总是提示如下错误 TypeError Descriptors cannot not be created directly If this call came from
  • 【编程测试题】数字游戏

    题目描述 小易邀请你玩一个数字游戏 小易给你一系列的整数 你们俩使用这些整数玩游戏 每次小易会任意说一个数字出来 然后你需要从这一系列数字中选取一部分出来让它们的和等于小易所说的数字 例如 如果 2 1 2 7 是你有的一系列数 小易说的数
  • 【删除列表中最后一条数据遇到的问题】

    项目场景 列表有多页数据 如果最后一页只有一条数据 当删除这条数据时 页码能够改变并且数据正确展示 问题描述 当删除这条数据时 页码可以正确展示 但是数据没有正确显示 handleDelete row const id row userId