小编Vis*_*ish的帖子

有没有办法根据值使用反应表来设置单个单元格的样式?

我想在反应表中设置单个单元格的样式,但我无法这样做。

const MOCK_DATA = [
  {
    amount: 1000,
    status: `SUCCESS`,
    updatedAt: 1629181927,
  },
  {
    amount: 2000,
    status: `FAILED`,
    updatedAt: 1629181927,
  },
];
Run Code Online (Sandbox Code Playgroud)
export const COLUMNS = [
  {
    Header: 'Date',
    accessor: 'transactionDate',
  },
  {
    Header: 'Amount',
    accessor: 'amount',
  },
  {
    Header: 'Status',
    accessor: 'status',
  },
];
Run Code Online (Sandbox Code Playgroud)

这是 jsx:

 <tbody {...getTableBodyProps()}>
        {rows.map(row => {
          prepareRow(row);
          return (
            <tr {...row.getRowProps()}>
              {row.cells.map(cell => (
                <td {...cell.getCellProps()}>{cell.render('Cell')}</td>
              ))}
            </tr>
          );
        })}
      </tbody>
Run Code Online (Sandbox Code Playgroud)

假设我想根据数据的状态将单元格的颜色更改为绿色或红色,如何实现?

笔记:

reactjs react-table-v7

3
推荐指数
1
解决办法
5796
查看次数

标签 统计

react-table-v7 ×1

reactjs ×1