title: React Redux - moving a function to the container from a stateless component
body: <p>Novice.</p>
  
  <p>I have refactored an address component into two. One is the <code>AddressContainer</code> and the other is the presentational component Address.</p>
  
  <p>The Address component is stateless however I need to set a value on a React-Select <code>async.Select</code> component that is part of the address component while updating another field via a redux dispatch - this works when its part of the one file however its not working now.</p>
  
  <p>I need to move the following function to the container and reference the value...</p>
  
  <pre><code>         const onSuburbChange = (value) =&gt; {
            this.setState({ selectedSuburb: value }, () =&gt; {
              input.onChange(value)
              updatePostcodeValue(value ? value.postcode : null, sectionPrefix)
            })
          }
  </code></pre>
  
  <p>Since the markup has been moved to its own file and referenced in the container as:</p>
  
  <pre><code>   &lt;Address handleSuburbSearch={this.handleSuburbSearch}
      addressData={addressData}
      updatePostcodeValue={updatePostcodeValue}
    /&gt;
  </code></pre>
  
  <p>I get the error</p>
  
  <blockquote>
    <p>address.jsx:100 Uncaught TypeError: Cannot read property 'setState' of undefined
        at Object.onSuburbChange [as onChange] (address.jsx:100)</p>
  </blockquote>
  
  <p>Its clear to me that Address is stateless and that state is being/needs to be set in the AddressContainer.. </p>
  
  <p>Here is the React-select component thats in the presentational component - these are all props that it requires:</p>
  
  <pre><code>             &lt;Select.Async
                {...inputProps}
                onChange={onSuburbChange}
                valueKey="id"
                labelKey="suburbName"
                loadOptions={handleSuburbSearch}
                backspaceRemoves={true}
              /&gt;
  </code></pre>
  
  <p>I would like to set the value of <code>onChange</code> in the addressContainer but I am unsure as to how rewrite <code>onSuburbChange</code> so it is passed the value and returns the value while also updating the postcode as per the other function <code>updatePostcodeValue</code>.</p>
  
  <p>How do I move <code>onSuburbChange</code> to the container and reference it in the presentational component?</p>