title: React - Cannot read property of undefined
body: <p>Normally  When i click on the menu item in the child component it calls {this.handlesort} which is a local function. Handle sort takes in onReorder props from my parent component. {onReorder} calls a local function called reOrder. It sets the state of {orderBy and orderDir}. The problem is that immediately when i click on {menuitem} it returns this error. (Uncaught TypeError: Cannot read property 'onReOrder' of undefined). Normally it works when i am not using es6. Please help</p>
  
  <p><strong>(Parent Component)</strong></p>
  
  <pre><code>export default class TenantView extends Component {
      constructor(props) {
          super(props);
          //setting state
          this.state = {
              //tenants: [],
              orderBy: 'name',
              orderDir: 'asc',};
      };
      componentWillMount() {
          this.setState({
              tenants:[{img: 'tenant1.jpg',name: 'John', address: '7 Gilbert', 
                       paid: 'true'},{img: 'tenant2.jpg',name:'Abba', address: 
                       '3 Vecq st', }]});//setState
      }//componentWillMount
  
  
  
      reOrder(orderBy, orderDir) {
          this.setState({
              orderBy: orderBy,
              orderDir: orderDir,
          });//setState
      }//reorder
  
      render(){
          var tenants = this.state.tenants;
          var orderBy = this.state.orderBy;
          var orderDir = this.state.orderDir;
  
          tenants = _.orderBy(tenants, function(item) {
              return item[orderBy].toLowerCase();
          }, orderDir);//orderBy
  
          tenants = tenants.map(function(item, index){
              return (
                  &lt;TenantList key = { index } singleTenant = { item } /&gt;
               )
          }.bind(this))
  
          return(
              &lt;div style={styles.root}&gt;
                  &lt;Subheader&gt;Payment Status&lt;/Subheader&gt;
  
                  &lt;PaymentStatus/&gt;
                  &lt;SearchTenant
                      orderBy = { this.state.orderBy }
                      orderDir = { this.state.orderDir }
                      onReOrder = { this.reOrder }
                  /&gt;
                  &lt;GridList cols={1} cellHeight={80} style={styles.gridList}&gt;
                      {tenants}
                  &lt;/GridList&gt;
              &lt;/div&gt;
  
          )//return
      }//render
  }
  </code></pre>
  
  <p><strong>childcomponent</strong></p>
  
  <pre><code>export default class SearchTenant extends Component {
      handleSort(e){
          this.props.onReOrder(e.target.id, this.props.orderDir)
      }//handleSort
  
      handleOrder(e){
          this.props.onReOrder(this.props.orderBy, e.target.id)
      }//handleSort
  
  
      render(){
         return(
             &lt;div className="input-group"&gt;
                 &lt;input placeholder="Search" type="text" onChange = { 
                  this.handleSearch }  className= "validate"/&gt;
                 &lt;DropDownMenu openImmediately={true}&gt;
                     &lt;MenuItem id = "name" onClick = {this.handleSort}&gt;Name{ ( 
                          this.props.orderBy === 'name') ? &lt;i 
                          className="material-icons"&gt;check_circle&lt;/i&gt;: null }
                     &lt;/MenuItem&gt;
                     &lt;MenuItem id = "address" onClick = 
                         {this.handleSort}&gt;Address{ 
                         (this.props.orderBy === 'address') ? &lt;i 
                         className="material-
                         icons"&gt;check_circle&lt;/i&gt;: null }
                     &lt;/MenuItem&gt;
                     &lt;MenuItem id = "asc" onClick = {this.handleOrder}&gt;Asc{ 
                         (this.props.orderDir === 'asc') ? &lt;i 
                         className="material-icons"&gt;check_circle&lt;/i&gt;: null }
                     &lt;/MenuItem&gt;
                     &lt;MenuItem id = "desc" onClick = {this.handleOrder}&gt;Desc{ 
                         (this.props.orderDir === 'desc') ? &lt;i 
                          className="material-icons"&gt;check_circle&lt;/i&gt;: null }
                     &lt;/MenuItem&gt;
                 &lt;/DropDownMenu&gt;
             &lt;/div&gt;
         )//return
      }//render
  }//TeamList
  </code></pre>