<Tooltip
placement="bottom"
title={
<span style={{ color: '#979898' }}>
{text}
</span>
}
visible={record.popVisible}
arrowPointAtCenter
color="white"
trigger={['hover']}
overlayStyle={{
maxWidth: 200,
}}
>
<Input
placeholder=""
allowClear={true}
className={record.viditeLotNo ? styles.setRed : ''}
value={text}
maxLength={100}
onMouseOver={(e) => this.handleVisibleChange(e, record.index, record)}
onMouseLeave={e => {
this.hidePopover(e,record.index);
}}
onChange={e => this.onDateOnChange(e, record.index, 'lotNo')}
/>
</Tooltip>
onDateOnChange = (date, index, type) => {
const { dataSource } = this.state;
if (type == 'expiryDate') {
dataSource[index].expiryDate = date ? moment(date).format(dateFormat): '';
dataSource[index].viditeDate = false;
} else {
let k = date.target.value;
if(k.length > 10) {
dataSource[index].popVisible = true;
}else {
dataSource[index].popVisible = false;
}
dataSource[index].lotNo = k;
dataSource[index].viditeLotNo = false;
}
this.setState({
dataSource
});
};
handleVisibleChange(e, index, record) {
const { dataSource } = this.state;
if(record.lotNo.length > 10) {
dataSource[index].popVisible = true;
}else {
dataSource[index].popVisible = false;
}
this.setState({
dataSource
});
}
hidePopover(e,index) {
const { dataSource } = this.state;
dataSource[index].popVisible = false;
this.setState({
dataSource
});
}
![在这里插入图片描述](https://img-blog.csdnimg.cn/28872f5244324af7a17b18f05dbba24d.png?x-oss-process=image/watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBAenVvX3p1b19ibG9n,size_20,color_FFFFFF,t_70,g_se,x_16)