title: Using redux-form, how can I reset the form values from another component?
body: <p>Here is a demo of my issue: <a href="https://stackblitz.com/edit/redux-form-reset-problems" rel="nofollow noreferrer">https://stackblitz.com/edit/redux-form-reset-problems</a></p>
  
  <p>I am using redux-form 7.2.0 and am trying to reset the form values from another component that is not wrapped by the ReduxForm HOC.</p>
  
  <pre><code>import React, { Component } from 'react';
  import { connect } from 'react-redux';
  import { reset } from 'redux-form';
  
  class MoodAnnouncement extends Component {
    constructor(props) {
      super(props);
      this.resetMood = this.resetMood.bind(this, event);
    }
  
    resetMood(event) {
      event.preventDefault();
      this.props.dispatch(this.props.reset('SearchFiltersForm'));
    }
  
    render() {
      return (
        &lt;div className="mui-panel"&gt;
          &lt;button
            className="mui-btn mui-btn--primary mui-btn--raised"
            disabled={this.props.MoodCheckerForm.values === undefined}
            onClick={this.resetMood}
          &gt;Reset Mood
          &lt;/button&gt;
        &lt;/div&gt;
      );
    }
  }
  
  const mapStateToProps = state =&gt; {
    return {
      MoodCheckerForm: state.form.MoodCheckerForm,
    };
  };
  
  export default connect(mapStateToProps, { reset })(MoodAnnouncement);
  </code></pre>
  
  <p>When I click the reset mood button that is in another component away from the form, I'm receiving the error <strong>this.props.dispatch is not a function</strong>, so I assume there is a different way to dispatch the reset action from within the connect HOC. </p>
  
  <p>How can I reset the form values from another component that is using the react-redux connect HOC?</p>