expend rows in Antd table with conditions (Antd 3.26.2)

Question

<Table pagination={{  pageSize: 30 showSizeChanger: true }}
       scroll={{ x: 500 }}
       dataSource={this.props.dataSource}
       columns={this.props.columns}
       expandedRowRender={record => <p>{record.description}</p>} />

I need add condition for this line:

expandedRowRender={record => <p>{record.description}</p>}

If I have a description for this record I need to expand for this row (Antd 3.26.2) Any idea?

Answer 1

You could work around absence of rowExpandable in older AntD versions by hiding from the user an option to expand the row, using CSS.

Per this suggestion:

If you don't want show expand icon for some rows, you can use rowClassName to add a custom className to the row, and hide the expand icon by CSS.

So in your case:

YourTable.jsx:

<Table pagination={{  pageSize: 30 showSizeChanger: true }}
       scroll={{ x: 500 }}
       dataSource={this.props.dataSource}
       columns={this.props.columns}
       expandedRowRender={record => <p>{record.description}</p>} 
       rowClassName={(record) => { if (record.description) {
       return "NotExpandible";}}}  />

App.css:

.NotExpandible .ant-table-row-expand-icon-cell {
  visibility: hidden;
}

YourTable.jsx file showing table with the expected result