javascript - 如何使用React删除表中的行？

我有一个表，它是Material UI中的Table组件。我从API提取数据，然后在表中显示数据。该表根据从Web套接字收到的事件更新所有行。我的要求是，当ID为10的行说其行值之一为“已关闭”时，我想从表中删除该特定行。
我使用数组存储来自API的数据，然后使用map（）将它们呈现在单独的行中。

    mapTableData = (TableData) => {
const newTableData = tempTableData.map((item, index) => ({
  ...item,
  Column1: () =>
    <p>
      {item.parameter1}
    </p>,
  Column2: () =>
   ........

当事件在Web套接字上到达且{item.parameter1}的值更改为“ Closed”时，我想从表中删除该特定行。如何实现呢？我尝试对每一列使用条件检查，但它只会给我空白行，并且不会将其删除。

最佳答案

您可以使用filter将项目遍历两次：

const render = (tableData) => {
    return tableData
        .filter(row => row.id !== 10)
        .map(row => {
            // render logic
        })
}

或者，更有效地使用reduce：

const render = (tableData) => {
    return tableData
        .reduce((aggr, row) => {
            if (row.id !== 10) {
                const jsx = ''; // some logic
                aggr.push(jsx);
            }

            return aggr;
        }, []);
}