title: Handling async request with React, Redux and Axios?
body: <p>I am new to React JS and Redux and it has been too overwhelming to get going. I am trying to make a POST request using Axios, but I am unable to make it. May be I am missing something in the container file. Below is the code. Check <a href="https://plnkr.co/edit/w8H3YvFCunqC3621lmmd?p=preview" rel="noreferrer">plnkr</a></p>
  
  <p><strong>Update:</strong>  I am getting @@redux-form/SET_SUBMIT_SUCCEEDED message after submitting. But when I am checking in the network tab, I don't see the call to API. And also when I am consoling the submitted values, I see only name and fullname values. It doesn't consist of logo and details. What am I missing?</p>
  
  <p><strong>Component file</strong></p>
  
  <pre><code>   import React, { PureComponent } from 'react'
     import PropTypes from 'prop-types'
     import { Field,reduxForm } from 'redux-form'
     import {   Columns,Column, TextArea, Label,Button  } from 'bloomer'
     import FormField from 'FormField'
  
     const validate = (values) =&gt; {
       const errors = {}
      const requiredFields = 
        ['organizationName','organizationFullName','organizationDetails']
  
      requiredFields.forEach((field) =&gt; {
       if (!values[field]) {
       errors[field] = 'This field can\'t be empty!'
      }
    })
       return errors
  }
  
    const formConfig = {
     validate,
     form: 'createOrganization',
     enableReinitialize: true
     }
  
    export class CreateOrganization extends PureComponent {
     static propTypes = {
       isLoading:PropTypes.bool.isRequired,
       handleSubmit: PropTypes.func.isRequired, // from react-redux     
       submitting: PropTypes.bool.isRequired // from react-redux
      }
     onSubmit = data =&gt; {
       console.log(data)
     }
    render () {
       const { handleSubmit,submitting,isLoading } = this.props
        return (
          &lt;Columns isCentered&gt;
          &lt;form onSubmit={handleSubmit(this.onSubmit.bind(this))} &gt; 
  
            &lt;Column isSize='3/6' &gt;        
              &lt;Label&gt;Organization Name&lt;/Label&gt;             
              &lt;Field 
                name="organizationName"
                component={FormField}
                type="text"
                placeholder="Organization Name"
              /&gt;   
            &lt;/Column&gt;       
  
  
            &lt;Column isSize='3/6'&gt;
              &lt;Label&gt;Organization Full Name&lt;/Label&gt;              
              &lt;Field
                name="organizationFullName"
                component={FormField}
                type="text"
                placeholder="Organization Full Name"
              /&gt;  
            &lt;/Column&gt; 
  
  
             &lt;Column isSize='3/6'&gt;            
              &lt;Label&gt;Organization Logo&lt;/Label&gt;              
              &lt;Input                  
                name="organizationLogo"                  
                type="file"
                placeholder="Logo"
              /&gt; 
            &lt;/Column&gt;
  
            &lt;Column isSize='3/6'&gt;
              &lt;Label&gt;Organization Details&lt;/Label&gt;         
                  &lt;TextArea placeholder={'Enter Details'} /&gt;               
            &lt;/Column&gt;          
  
  
            &lt;Column &gt;
              &lt;span className="create-button"&gt;
                &lt;Button type="submit" isLoading={submitting || isLoading} isColor='primary'&gt;
                  Submit
                &lt;/Button&gt;  
              &lt;/span&gt; 
                &lt;Button type="button" isColor='danger'&gt;
                  Cancel
                &lt;/Button&gt;                
            &lt;/Column&gt;  
  
          &lt;/form&gt;
        &lt;/Columns&gt;
      )    
    }
  }
  
    export default reduxForm(formConfig)(CreateOrganization)
  </code></pre>
  
  <p><strong>Container File</strong></p>
  
  <pre><code>   import React, { PureComponent } from 'react'
     import PropTypes from 'prop-types'
     import { connect } from 'react-redux'
     import Loader from 'Loader'
     import organization from 'state/organization'
     import CreateOrganization from '../components/createOrganization'
  
     export class Create extends PureComponent {
     static propTypes = {    
       error: PropTypes.object,
       isLoaded: PropTypes.bool.isRequired,  
       create: PropTypes.func.isRequired,   
      }
      onSubmit = data =&gt; {
        this.props.create(data)
      }
  
      render () {
        const { isLoaded, error } = this.props
      return (      
         &lt;CreateOrganization onSubmitForm={this.onSubmit} isLoading=
           {isLoading} /&gt;    
       )
     }
   }
  
     const mapStateToProps = state =&gt; ({
       error: organization.selectors.getError(state),
       isLoading: organization.selectors.isLoading(state)
     })
  
      const mapDispatchToProps = {
        create: organization.actions.create
      }
  
  
    export default connect(mapStateToProps, mapDispatchToProps)(Create)
  </code></pre>