title: Async in mapDispatchToProps - wrapper to ensure everything dispatches before rendering
body: <p>The result I want is my component to not render unless all the async function have dispatched. I'm using this as a wrapper to make sure everything has dispatched. I've tried two ways:</p>
  
  <ol>
  <li><p>call everything in <code>componentWillMount</code> and use <code>setState</code> to set <code>loaded = true</code>. I can then render the component based on my state's loaded key.</p>
  
  <pre><code>ajax = async () =&gt; {
    try{
      const { dispatch } = this.props;
      dispatch(loadPack('ars'));
      dispatch(loadPack('acr'));
      await dispatch(loadProds());
      await dispatch(loadRepls());
      await dispatch(checkEligibile());
      }catch (e) { console.log(e)}
   }
  
   componentWillMount() {
     this.ajax().then(() =&gt; {
       this.setState({ loaded: true });
     });
   }
  
  render() {
   const { loaded } = this.state;
   return loaded ? &lt;Component/&gt; : null;
  }
  </code></pre></li>
  </ol>
  
  <p>This gets the desired results, except I see this error:</p>
  
  <blockquote>
    <p>ExceptionsManager.js:71 Warning: Can only update a mounted or mounting
    component. This usually means you called setState, replaceState, or
    forceUpdate on an unmounted component. This is a no-op.</p>
  </blockquote>
  
  <ol start="2">
  <li>I tried dispatching in <code>mapDispatchToProps</code>. Ideally <code>loaded</code> should return true and I should see <code>this.props.loaded = true</code> to load my component. However, I'm receiving a Promise and not the result.</li>
  </ol>
  
  <p>I'm feeling stuck here and not sure what else to try. Any suggestions?</p>
  
  <pre><code>const loadAsync = async dispatch =&gt; {
    dispatch(loadPack('ars'));
    dispatch(loadPack('acr'));
    await dispatch(loadProds());
    await dispatch(loadRepls());
    await dispatch(checkEligibile());
    return true
   };
  
   export const mapDispatchToProps = dispatch =&gt; ({
     loaded: loadAsync(dispatch),
   });
  </code></pre>