想要在反應選擇中取得有關 inputValue 變更的選項

Question

我有一個react-select元件，我想添加一個功能，這樣一旦有人在react-select中輸入某些內容，就應該有一個api請求來獲取與輸入的關鍵字相關的項目，如何才能我這樣做

Answer 1

你可以做到這一點，無需任何 API 呼叫，只需使用過濾器方法來過濾你的選項

Answer 2

您應該嘗試從“react-select/async”查看 AsyncSelect 然後在元件中建立一個函數來從 API 載入選項，該函數應接受輸入字串和回調，並應根據輸入字串進行 API 呼叫。像這樣的事情

const loadOptions = (inputValue, callback) => {
    // api call here
    fetch('your-api-url?${inputValue}')
      .then(response => response.json())
      .then(data => {
         // do your work here
         const options = //transform data here
         callback(options)
      });
};

然後在您的元件中將 loadOptions 函數傳遞到 loadOptions 屬性中

const YourComponent = () => {
    return (
       <AsyncSelect
         cacheOptions
         defaultOptions
         loadOptions={loadOptions}
       />
    );
};