- 思路
第一步:给失焦事件添加timeou超时调用
第二步:选择事件清除超时调用
废话少说,上代码:
// 第一步
SearchBlur = val => {
// console.log(val);
this.SearchBlurTimout = setTimeout(() => {
this.state.params.key = val;
this.state.params.pageNo = 1;
this.reloadData(this.state.params);
}, 300);
};
// 组件卸载清除超时调用
componentWillUnmount() {
clearTimeout(this.SearchBlurTimout);
}
第二步:
// 列表项点击选择事件
handleSelect = item => {
this.SearchBlurTimout && clearTimeout(this.SearchBlurTimout);
const { data, params } = this.state;
if (!params.key) this.setState({ spinClass: null, showSearch: false });
if (item.occupy && !item.select) {
this.setState({ occDetails: true, occRoom: item });
} else {
this.setState({ occDetails: false, occRoom: null });
}
data.map(newItem => {
if (newItem.id != item.id) {
newItem.select = false;
}
});
item.select = !item.select;
this.setState({ data: data, selectValue: item.select ? item : null });
};
网友评论