React Props is Not Defined : <p>I'm having trouble understanding why my props.updateBuilding is not working. </p>

<p>The following works when the prop is within the render method </p>

<pre><code>class Buildings extends Component {
  constructor(props) {
      super(props);
  }

  componentWillMount() {
    this.props.fetchBuildings();
  }

  renderBuildings(building) {
    return (
      &lt;div&gt;
          &lt;p&gt; {building.name}&lt;/p&gt;
      &lt;/div&gt;
    );
  }


  render() {
    return (
      &lt;div&gt; 
        {this.props.buildings.map(this.renderBuildings)}
        &lt;button type="button" className="btn btn-success" onClick={this.props.updateBuilding.bind(this, 1)}&gt;Edit&lt;/button&gt;
      &lt;/div&gt;
    );
  }
}

function mapStateToProps(state) {
  return { buildings: state.buildings.all };
}
function mapDispatchToProps(dispatch){
  return bindActionCreators({ fetchBuildings, updateBuilding}, dispatch);
}
</code></pre>

<p>But when I put <code>this.props.updateBuilding</code> to the renderBuildings method like below... </p>

<pre><code>  renderBuildings(building) {
    return (
      &lt;div&gt;
          &lt;p&gt; {building.name}&lt;/p&gt;
          &lt;button type="button" className="btn btn-success" onClick={this.props.updateBuilding.bind(this, building.id)}&gt;Edit&lt;/button&gt;
      &lt;/div&gt;
    );
  }
</code></pre>

<p>I get the error: </p>

<pre><code>Cannot read property 'props' of undefined
</code></pre>

<p>It seems that the prop <code>updateBuildings</code> cannot be read when it is inside the renderBuildings method and I'm not sure what is causing this. </p>
