如何将React Select与Rest API（远程数据）集成

我对

ReactJS

非常陌生，我正在尝试创建一个包含值列表（应该从API获取）的组件，并且应该允许搜索

---

上面的示例运行良好，但它使用本地数据。如何与远程数据集成。每次按键时，它都会点击API并获取新数据。

您要查找的是React Select，如@Laura所述。文档有点混乱。以下是文档中的基本示例：

import React，{Component}来自'React'；
从'react select/lib/Async'导入AsyncSelect；
从“../data”导入{colorOptions}；
常量过滤器颜色=（inputValue:string）=>{
返回颜色选项。过滤器（i=>
i、 label.toLowerCase（）.includes（inputValue.toLowerCase（））
);
};
const promiseOptions=inputValue=>
新承诺（解决=>{
设置超时（（）=>{
解析（过滤颜色（输入值））；
}, 1000);
});
导出带有扩展组件的默认类{
render（）{
返回(
);
}
}

您将在这里看到，

loadOptions

采用了一个

promiseOptions

方法，该方法返回了一个承诺，最终解析为选项列表。如果用

fetch（）

（返回承诺）替换该方法的内部，那么当该请求解析为选项列表时，这些选项将应用于

AsyncSelect

const promiseOptions=inputValue=>{
常量url=`my/remote/source${inputValue？'？searchParam='+inputValue:'}`；
返回获取（url）
.then（response=>response.json（））//我的选项列表数组？
.catch（错误=>{
log（'some error'，err）；
});
};

您是否阅读了async react select文档？