在树形的table中,如果数据结构中的children的值是[ ],没有值,table还是会显示展开按钮,希望的结果的是没有children或是没有值就不显示展开按钮,就使用到expandIcon这个属性。
下面是我的例子
customExpandIcon=(props)=> {
if(props.record.children.length > 0){
if (props.expanded) {
return <a style={{ color: 'black',marginRight:8 }} onClick={e => {
props.onExpand(props.record, e);
}}><Icon type="minus-square" style={{fontSize:16}}/></a>
} else {
return <a style={{ color: 'black' ,marginRight:8 }} onClick={e => {
props.onExpand(props.record, e);
}}><Icon type="plus-square" style={{fontSize:16}}/></a>
}
}else{
return <span style={{marginRight:8 }}></span>
}
}
<Table bordered={ true }
loading={ loading }
columns={ columns }
dataSource={ dataList }
rowKey={(row) => { return row.value }}
pagination={ pagination }
expandIcon={(props) => this.customExpandIcon(props)}
/>
代码中是判断了props,record的值。children是否有值,然后返回,如果没有就返回一个span。
image.png
网友评论