0

我通过对后端进行 API 调用来将行填充到我的 X-Grid 表中。我正在努力从表中删除一行。我启用了复选框选择来选择一行,并且我已经编写了一个删除按钮来删除数据。到目前为止,我当前的代码只删除了表中的行,而不是后端。此外,当我在删除初始行后选择另一行时,删除的行会重新出现。

这是我的 X-Grid 代码:

<XGrid
              apiRef={apiRef}
              pageSize={pageSize}
              page={page}
              rowsPerPageOptions={[25, 50, 100]}
              rowCount={total}
              onPageChange={onHandlePageChange}
              onPageSizeChange={onHandlePageSizeChange}
              rows={rows}
              columns={columns}
              paginationMode="server"
              pagination
              checkboxSelection={true}
              onSelectionModelChange={(newSelection) => {
                setSelectionModel(newSelection.selectionModel);
                if (disabled) {
                  handleRemoveButtonEnabled();
                }
                else {
                  handleRemoveButtonDisabled();
                }
              }}
              selectionModel={selectionModel}
              disableColumnResize={true}
              hideFooterSelectedRowCount={true}
            />

这是我的删除按钮功能代码:

  const [selectionModel, setSelectionModel] = React.useState([]);

  const handleRowDelete = () => {
    selectionModel.map(value => selectedRow = value);
    apiRef.current.updateRows([{ id: selectedRow, _action: "delete" }]);
    selectedRow = -1;
  }

我已经尝试在各个地方进行控制台日志记录,似乎所选行在删除后仍保持选中状态。我有 selectedRow = -1; 那里的语句试图不选择任何行。我什至尝试使用 setSelectionModel(null) 或 setSelectionModel([]) 代替最后一条语句,但该行没有删除。我在控制台中没有看到任何错误,只是代码不起作用。

4

0 回答 0