/** *工具组件封装 * 用于行点击选中处理 * */ export const dealWidthSelectRow = dealData =>{ const { rowKeys,//选中行key值数组 rows,//选中行对象数组 record//选中单行对象 } = dealData; let x = rowKeys.findIndex((value,index)=>{ return value === record.key }); if(x === -1){ rowKeys.push(record.key); rows.push(record) }else{ delete rowKeys[x]; delete rows[x] } TrimSpace(rows); TrimSpace(rowKeys); return { rowKeys:rowKeys, rows: rows } };
组件页面:
class A extend ...{ onRowClick = (record, selected, selectedRows, nativeEvent)=>{ let dealData = { rowKeys : this.state.selectedRowKeys, rows : this.state.selectRows, record : record }; let {rowKeys, rows} = dealWidthSelectRow(dealData); console.log(rowKeys); console.log(rows); this.setState({ selectedRowKeys:rowKeys, okSelectNum: rows.length, selectRows: rows }) };
render(){
return (
<Table rowClassName={(record) => { let className = null; if (record.id === '' || record.id === null || record.id === undefined) { className = 'close_checkbox' } return className } } onRow={(record, index) => { return { onClick: () => { this.onRowClick(record, index) } //点击行 } }} rowSelection={rowSelection} columns={this.columns} dataSource={data} loading={loading} onChange={this.handleTableChange} pagination={{ total: pageTotal, showQuickJumper:true, current: pagination.pageNum }} />
)
}
}