当前位置: 首页 > 知识库问答 >
问题:

javascript - ElementUI 组件排序后删除按钮随机删除元素,如何排查和解决?

慕烨烁
2024-06-28

接手别人的前端代码,发现一个奇怪的问题,用的elementUI组件,排序后点击删除按钮会随机删除,但是打印传入的下标发现又是正确的,只剩一个元素时可以正常删除,可能有哪些原因?
删除函数

 async onDelDtlGood(rowIndex) {
            console.log(rowIndex);
            this.addForm.dtlGoods.splice(rowIndex, 1);
        },

排序函数

 customSort(a, b) {
          const aCode = a.goodsCode;
          const bCode = b.goodsCode;
          if (aCode < bCode) {
            return -1;
          }
          if (aCode > bCode) {
            return 1;
          }
          return 0;
        },

删除按钮

  <el-table-column lable="操作" width="120">
      <template slot-scope="scope">
          <el-button type="danger" @click="onDelDtlGood(scope.$index)">
             删除
           </el-button>
      </template>
 </el-table-column>

尝试了防止事件冒泡,重写排序函数,去除删除函数的异步修饰符,对this.addForm.dtlGoods.splice(rowIndex, 1) 加await,但是都不起作用

共有2个答案

罗均
2024-06-28

讲真 能把下标换成id(唯一)就换成id
不能的话 打印下this.addForm.dtlGoods.splice(rowIndex, 1);
splice是有返回值的 看下截取的这个元素跟你那个rowIndex啥关系就行了
打印可以让你知道(推测)99%的问题的出现原因

葛兴发
2024-06-28

并不是随机删除,而是index是实时的变化,不是你打印的时候的顺序. 只剩下一个元素时已经无法变了,自然可以正常删

 类似资料:
  • 问题内容: 使用标准JavaScript删除元素时,必须首先转到其父元素: 首先必须去父节点对我来说有点奇怪,JavaScript是否有这样的原因? 问题答案: 我知道,增强本机DOM功能并不总是最好的或最受欢迎的解决方案,但是对于现代浏览器来说,这很好。 然后你可以删除这样的元素 要么 注意:此解决方案不适用于IE 7及更低版本。有关扩展DOM的更多信息,请阅读本文。 编辑:回顾我在2019年的

  • 如上图片, 每个方块都有一个宽,高,X轴,Y轴; 有可能宽占多份, 高占多份; 但宽度最大就占3份, 高度不限; 每次删除一个格子, 下面的格子自动往左往上补齐; 给到数据假如是: 删除id为5的格子后,希望得到的是:

  • 问题内容: 对此问题的任何帮助将不胜感激。 我有一个元组列表 并且我需要删除某种类型的重复项:根据我的定义,(1,2)和(2,1)被视为重复项。所需输出 提前致谢 问题答案: 您可以对它们进行排序,然后使用删除重复项:

  • 问题内容: 比方说: 对此: 我一直在寻找使用Mootools,jQuery甚至是(原始)JavaScript的方法,但是却不知道该怎么做。 问题答案: 使用jQuery,您可以执行以下操作: 快速链接到文档: 内容(): jQuery replaceWith( 内容 :[ 字符串 | 元素 | jQuery ]): jQuery

  • 问题内容: 我是一个新手。有人可以告诉我如何使用原始Javascript(而不是jQuery)删除HTML元素。 当我单击“提交”按钮时,会在很短的时间内消失然后立即出现。单击按钮时,我想完全删除该元素。 问题答案: 发生的情况是正在提交表单,因此页面(带有其原始内容)正在刷新。您正在通过“提交”按钮处理事件。 如果要删除元素 而不 提交表单,请改为处理表单上的事件,然后从处理程序中返回: HTM

  • 问题内容: var arr = [1,2,3,5,6]; 删除第一个元素 我想删除数组的第一个元素,使其变为: 删除第二个元素 扩展这个问题,如果我想删除数组的第二个元素以使其变为: 问题答案: 要获得更灵活的解决方案,请使用该功能。它允许您根据索引值删除数组中的任何项目:

  • 问题内容: 我有一个数组例如: 谁能告诉我如何从数组中删除一个元素。例如,我要删除项目“ b”,以使数组如下所示: 我找不到解决办法。到目前为止,我在这里发现的内容不适用于我:( 问题答案: 您不能从数组中删除元素。Java数组的大小是在分配数组时确定的,不能更改。您能做的最好的事情是: 在相关位置分配给数组;例如 这给您带来了处理值所在数组中的“孔”的问题。(在某些情况下,这不是问题……但是在大

  • 问题内容: 如何从JavaScript中的数组中删除空元素? 有没有简单的方法,还是我需要遍历它并手动将其删除? 问题答案: 编辑: 大约9年前,当时没有很多有用的内置方法时,就回答了这个问题。 现在,当然,我建议您使用该方法。 请记住,此方法将为您返回 一个新数组, 其中的元素可以通过您提供给它的回调函数的条件。 例如,如果要删除或值: 例如,这将取决于您认为什么是“空”,如果您正在处理字符串,