在最开始设置一个全局变量 const keys = [];
在设置列参数的函数中render个open函数
{
title: ‘操作‘,dataIndex: ‘action‘,key: ‘action‘,className: ‘hotAaction hotZaction‘, render: (text,record) => <a href="javascript:void(0);" onClick={(e) => this.open(e,record)}>查看热度走势</a>
}
open = (e,record) => {
if ($(e.target).parent().hasClass(‘hotZaction‘)) {
keys.push(record.key);//点击的每一行的key的值保存下来。
this.setState({
arr: keys
})
e.target.innerHTML = ‘查看热度走势‘
$(e.target).parent().addClass(‘hotSaction‘);
$(e.target).parent().removeClass(‘hotZaction‘);
} else if (e.target.innerHTML === ‘查看热度走势‘) {
keys.splice(keys.indexOf(record.key),1);//再次点击的时候从数组删除上次存入的key值。
this.setState({
arr: keys
})
e.target.innerHTML = ‘查看热度走势‘
$(e.target).parent().addClass(‘hotZaction‘);
$(e.target).parent().removeClass(‘hotSaction‘);
}
}
//表格设置展开行的函数
<Table showHeader
className="components-table-demo-nested eventList"
columns={this.containerTableColumns}
dataSource={this.containerTableData}
expandedRowRender={this.getEcharts}
loading={loading}
pagination={false}
expandedRowKeys={this.state.arr}
rowKey={row => row.key}
/>
/*各个图表*/
getEcharts = (record) => {
//展开内容的逻辑,我这边是展开的内容是一个个的图表
return (
<div className={"hotEchar" + record.key}>
<HotAnomaly />
</div>
)
}
}
然后你会发现在第一列还是有那个自带的展开的小图标在,没找到隐藏的方法,只能在css中进行隐藏了