Reactjs 非加载选项中的异步选择

我正在尝试使用React select动态加载select字段的选项。下面是我在Select中返回loadOptions的方法

 onChange(e)  {
    console.log("Value Printed : " + e);
 if(e.length > 3) {


 new Promise(resolve => {
    setTimeout(() => {           
    const url = `http://localhost:3010/cityNames?name=${e}`;
    fetch(url)
   .then(results => results.json())
   .then(data => {        
       var options = [];    
        options = data;
        console.log("return value from server: " + JSON.stringify(data));
        return {options: data};
   });
    }, 1000);
});

} else {console.log("Enter 3 chars");}
};

但我的选项没有显示

这是渲染组件

   <AsyncSelect
    isClearable
    loadOptions={this.onChange}
    onInputChange={this.onChange}
   />

---

显然，在获取数据时，组件不会重新呈现。尝试改用state

.then((data) => {      
    this.setState({ options: data });
});

和内部渲染：

<Select
   isClearable
   options={this.state.options}
   onInputChange={this.onChange}
/>

---

显示

数据

变量已更新。谢谢，它没有在控制台中给出任何错误，也没有显示浏览器上的选项。console.log显示了我从后端获得的值，但它没有显示。这里是数据变量<代码>[{“label”：“Dallas”，“value”：680780}]@ShivaNara将您的异步选择替换为正常的反应选择，它应该是精细的，但当我清除文本并输入新文本时，它不会获取新结果？

<Select
   isClearable
   options={this.state.options}
   onInputChange={this.onChange}
/>

onChange = (inputValue) => {
  if (inputValue.length > 3) {
      const url = `http://localhost:3010/cityNames?name=${inputValue}`;
        fetch(url)
          .then(results => results.json())
          .then(data => {
             this.setState({
                options: data,
             });
          });
    });
};