title: React-select - resolve a promise according to state value
body: <p>I am currently using React-select async.</p>
  
  <p>My options are returned based on the states return from its parent, which is from an async process.
  Found that the options in select box keeps empty because my <code>options</code> from parent is not returned yet.</p>
  
  <p>Except moving in the async process from parent into this <code>MultiDropdownSelectBox</code> component, is there any way to resolve the promise when I get the options (which is not empty array) from its parent? Like keep checking on the options and resolve it when it is not empty? or using <code>useEffect</code>?</p>
  
  <pre><code>import React, { useState, useEffect } from 'react';
  import AsyncSelect from 'react-select/async';
  
  const MultiDropdownSelectBox = ({options}) =&gt; {
  
    const [inputValue, setInputValue] = useState("");
  
    const promiseOptions = inputValue =&gt;
      new Promise(resolve =&gt; {
      setTimeout(() =&gt; {
        resolve(options);
      }, 1000);
    });
  
    return (
      &lt;AsyncSelect
        isMulti
        cacheOptions
        defaultOptions
        loadOptions={promiseOptions}
      /&gt;
    );
  }
  
  </code></pre>
  
  <p>Any advice and suggestions will be greatly appreciated.</p>