react 输入框模糊搜索
react 输入框模糊搜索async fetch(value, callback) {const that = thislet timeoutlet currentValueif (timeout) {clearTimeout(timeout);timeout = null;}currentValue = value;async function fake() {const r
·
react 输入框模糊搜索

async fetch(value, callback) {
const that = this
let timeout
let currentValue
if (timeout) {
clearTimeout(timeout);
timeout = null;
}
currentValue = value;
async function fake() {
const res = await that.request.findAllAdministrativeOrg({ name: value })
console.log(res, "+++++++++++++")
const data = [];
res.data.forEach(r => {
data.push({
id: r.id,
name: r.name,
});
});
callback(data);
console.log(data, "+=============+")
}
timeout = setTimeout(fake, 300);
}
handleSearch = (val) => {
console.log(val, "33333333")
this.fetch(val, data => this.setState({ findAllAdministratList: data }));
console.log(this.state.findAllAdministratList, '4444444444')
};
handleChange = (val, b) => {
console.log(val, b);
this.setState({ performUnitCode: val, performUnitName: b.children, })
this.fetch(val, data => this.setState({ findAllAdministratList: data }));
};
HTML
render() {
const { findAllAdministratList } = this.state
const { Option } = Select;
-------
return <div>---------
<Col span={12}>
<Form.Item name="performUnitCode" label="执行单位" rules={[{
required: true,
message: '请选择执行单位',
}]}>
<Select
showSearch
placeholder="请选择"
style={{ width: "100%", height: 32 }}
defaultActiveFirstOption={false}
showArrow={false}
filterOption={false}
onSearch={this.handleSearch}
onChange={this.handleChange}
notFoundContent={null}
>
{findAllAdministratList.map(item => {
return <Select.Option value={item.id}>{item.name}</Select.Option>
})}
</Select>
</Form.Item>
</Col>
表单修改回显的时候需要再掉一遍
//详情接口
async selectPatrolTaskDto(params?) {
const res = await this.request.selectPatrolTaskDto({ ...params, id: this.state.id })
console.log(res)
this.fillInput(res.data)
this.setState({
version: res.data.version
}, () => {
this.findAllAdministrativeOrgss(res.data.performUnitName)
})
}
//下拉列表数据详情
async findAllAdministrativeOrgss(name) {
const res = await this.request.findAllAdministrativeOrg({ name: name })
console.log(res)
const data = [];
res.data.forEach(item => {
data.push({
id: item.id,
name: item.name
});
});
console.log(data, '111111111222')
this.setState({
findAllAdministratList: data
}, () => {
});
console.log(this.state.findAllAdministratList, ')))))))))))))))))')
}
魔乐社区(Modelers.cn) 是一个中立、公益的人工智能社区,提供人工智能工具、模型、数据的托管、展示与应用协同服务,为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作,由全产业链共同建设、共同运营、共同享有,推动国产AI生态繁荣发展。
更多推荐



所有评论(0)