根据条件为一排蚂蚁桌上色

Question

我在项目中使用antd表。如果 IsDefaultAccount = true 其中 IsDefaultAccount 来自后端

，我想更改表格的一行颜色

index.js 页中表的代码为：

<Table
                    className="table-layout"
                    columns={this.state.columns}
                    dataSource={filteredData}
                    rowClassName='data-row'
                    bordered={true}
                    size={"small"}
                    onRowDoubleClick={ (record, index, event) => this.handleEditModal(record) }
                    onRowClick={(record, index, event) => this.handleRowClick(record)}
                    loading={this.state.loading}
                    pagination={{ pageSize: 14 }}
                />

Answer 1

假定每个数据项都包含一个IsDefaultAccount属性：

<Table
  className="table-layout"
  columns={this.state.columns}
  dataSource={filteredData}
  rowClassName={(record) => record.IsDefaultAccount ? 'data-row active-row' : 'data-row' }
  bordered={true}
  size={"small"}
  onRowDoubleClick={ (record, index, event) => this.handleEditModal(record) }
                    onRowClick={(record, index, event) => this.handleRowClick(record)}
  loading={this.state.loading}
  pagination={{ pageSize: 14 }}
/>

让我知道这是否可行。