选择"MUI 数据表上的行"

Question

这是我第一次在 React 中使用 MUI 数据表。 我想从我在复选框中选择的行中获取数据。

const options = {

download: false,
print: false,
viewColumns: false,
filterTable: false,
filter: false,
onRowsSelect:(currentRowsSelected: any, allRowsSelected: any) => {console.log(allRowsSelected);}

};

这只给了我所选行的索引。有没有办法获取其行的数据。我需要该行的第一个单元格来删除/更新数据库。 谁能帮我 谢谢。

Answer 1

似乎当前的onRowsSelectAPI 只提供所选行的索引和所选行数。

若要检索行数据，必须提供onRowClick函数。它侦听一行上的click事件。

onRowClick: (rowData, rowState) => {
console.log(rowData, rowState);
},

Answer 2

你需要使用onRow甚至在选项中点击

const options = {
filterType: 'dropdown',
responsive: 'scrollFullHeight',
serverSide: true,
count: total,
page: page,
onRowClick: handleRowClick,
}

并将此选项传递到 MUI 数据表中

<MUIDataTable
title={"Service Request List"}
data={requests}
columns={columns}
options={options}
/>

下面是行单击处理程序：

const handleRowClick = (rowData, rowMeta) => {
console.log(rowData, rowMeta);
};

Answer 3

您可以从onRowsSelect函数中获取所选列的索引：

onRowsSelect : (curRowSelected, allRowsSelected) => {
console.log("---RowSelect")
console.log("Row Selected: ", curRowSelected);
console.log("All Selected: ", allRowsSelected);
}

并使用此索引从数据列表中获取数据