Undefined is not an object evaluating this.state/this.props

Question

How do I bind a function outside of scope in React Native? I\'m getting the errors:

undefined is not an object evaluating this.state   

&

Answer 1

this.props are read-only

React docs - component and props

And therefore a component shouldn't try a to modify them let alone mutate them as you are doing here:

  _buttonPress = () =>  {
      this.props.navigator.push({
        id: 'Main'
      })
  }

I'd suggest using state instead:

_buttonPress = () =>  {
  this.setState = {
    ...this.state,
    navigator: {
      ...this.state.navigator,
      id: 'Main'
    }
  }
}

---

Regarding your binding issue:

the .map method takes a 2nd argument that is used to set the value of this when the callback is invoked.

In the context of your question, you just need to pass thisas the 2nd argument to you .map method to bind the components scope's this to it.