title: ReferenceError : Dispatch is not defined
body: <p>I have a Connector, which has mapDispatchToProps and mapStateToProps functions, and I need to dispatch a action from my main component.</p>
  
  <p>I'm getting an error saying dispatch is not defined when I'm trying to dispatch <code>fetchPlaces(this.props.user.id)</code></p>
  
  <p><code>this.props.user.id</code> has value 1.</p>
  
  <p>I need to get the user id and pass it to fetchPlaces, which intern gets me the places of the user. I'm not sure how to do it.</p>
  
  <p>Connector </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>const mapStateToProps = function (store) {
      return {
          elements: store.elements.elements,
          places: store.places.places,
          geocode : store.geocode.geocode,
          user : store.user.user
      };
  };
  
  const mapDispatchToProps = function (dispatch) {
      return {
          userAction : dispatch(fetchUser()),
          elementsAction : dispatch(fetchCategories()),
          placesAction: (id) =&gt; { dispatch(fetchPlaces(id)) }        
      }
  }
  
  class BasicinfoConnector extends React.Component{
    render() {
        console.log(this.props.user);
        if(typeof this.props.user.id != "undefined"){
            return (
                &lt;Basicinfo elements={this.props.elements} places={this.props.places} geocode={this.props.geocode} user={this.props.user}/&gt;
            );
        }
        else{
            return null;
        }
    }
  }
  
  export default Redux.connect(mapStateToProps, mapDispatchToProps)(BasicinfoConnector);</code></pre>
  </div>
  </div>
  </p>
  
  <p>Component :</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>componentWillMount() {
          console.log(this.props);
          console.log(this.props.user.id);
          dispatch(fetchPlaces(this.props.user.id))
      }</code></pre>
  </div>
  </div>
  </p>
  
  <p>Is <code>placesAction: (id) =&gt; { dispatch(fetchPlaces(id)) }</code> the right syntax of doing it?</p>
  
  <p><strong>UPDATE</strong></p>
  
  <p>I changed <code>componentWillMount</code> : </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>componentWillMount() {
          console.log(this.props);
          console.log(this.props.user.id);
          dispatch(this.props.placesAction(this.props.user.id))
      }</code></pre>
  </div>
  </div>
  </p>
  
  <p>and mapDispatchToProps :</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>const mapDispatchToProps = function (dispatch) {
      return {
          userAction: bindActionCreators(fetchUser, dispatch),
          elementsAction: bindActionCreators(fetchUser, dispatch),        
          placesAction: (id) =&gt; { dispatch(fetchPlaces(id)) }
      }
  }</code></pre>
  </div>
  </div>
  </p>
  
  <p>Still have the same error.</p>