antd Select下拉框模糊查询

antd Select下拉框模糊查询

//searchdata 点击旁边的查询按钮可以用的数据
state={
   employeeList: [], //查询出来的数据
     searchdata: {
        param: {
          ecommerce: null,
        },
      },
}
  //Select下拉框最多显示一百条数据
  searchPeoplefetchVendor(value) {
    const self = this;
    api.post(APIS.transferProcessTaskHandlersEmployee + '1/100/1', {
      data: { name: value || '' }
    }).then(function (response) {
      let employeeList = self.state.employeeList
      employeeList = response.data.data.records
      console.log(employeeList)
      self.setState({ employeeList, });
    });
  };
// Select onSearch 参考官网说明  
	let {employeeList }=this.state
    let codeOpt = [];
    codeOpt = employeeList && employeeList.map((item, i) => <Option key={i} value={item.workNumber}>{item.name + '(' + item.workNumber + ')'}</Option>);


			<Select
                placeholder="请输入"
                size="small"
                style={{ width: '160px' }}
                allowClear={true}
                showSearch
                value={searchdata.param.ecommerce}
                filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
                onSearch={(value) => {
                  that.searchPeoplefetchVendor(value)
                }}
                onChange={(value)=>{
                  searchdata.param.ecommerce = value
                  that.setState({ searchdata});
                }}
                >
                {codeOpt}
            </Select>

你可能感兴趣的:(select模糊查询)