javascript - 如何插入元素 react Hook 状态数组

Question

我正在使用 react-bootstrap-table2 制作 HTML 表格，我正在使用表格内的复选框来删除项目。

根据 This link ，提到了如何获取选定的行然后执行下一部分，这里我正在做的是当我单击任何复选框行时被选中，如果我再次选择要添加到数组的任何行进入我的状态如下图

onSelect: (row, isSelect, rowIndex, e) => {
        if (isSelect === true) {
            setrowData((rowData) => [...rowData, row]);
        } else {
        //  here i need to do something
        }
    },

我的问题是，当我取消选择该值未从我的数组中删除的行时，在删除时，我拥有我选择过一次的所有数据。

• 与此相关的另一件事是，当我选中任何行时，我想显示删除按钮，当没有选中任何行时，我想隐藏删除按钮，这里 select 给出了我是它的 bool 值，但是一旦我选择多行它就会显示出来，它对每个选择都有效，但是当我取消选择其中任何一个时，删除按钮会隐藏

我为此所做的如下所示

setrowSelect((rowSelect) => [...rowSelect, isSelect]); // this one is inside onSelect callback given by the react-bootstrap-table2 library

           {rowSelect && (
                    <button className="btn Secondary_Button_with_Icon">
                        <i className="ri-upload-cloud-line ri-lg"></i>Register
                    </button>
                )}

My full working code

Answer 1

在 else block 中使用过滤方法从数组中删除未选择的元素

 onSelect: (row, isSelect, rowIndex, e) => {
      if (isSelect === true) {
        setrowData((rowData) => [...rowData, row]);
      } else {
        setrowData((rowData) => rowData.filter((x,i)=>i!==rowIndex))
      }
      setrowSelect((rowSelect) => [...rowSelect, isSelect]);
    },