How to call function in a function on react-native?

Question

Hi this is my first time developing apps in javascript and react-native, its kind of a noob question. How do I call _getData function in __onRegionChangeComplete function? I tried this._getData() it shows

error: undefined is not a function(evaluation'this._getData()')').

var React = require('react-native');

var {
  StyleSheet,
  Text,
  View,
  Image,
  MapView,
  Component,
} = React;

class Map extends Component {
  render() {
    return (
      <View style={styles.container}>
        <MapView style={styles.map} 
          showsUserLocation={true}
          onRegionChangeComplete={this._onRegionChangeComplete}
        />
      </View>
    );
  }

  _onRegionChangeComplete(region)
  {

  }

  _getData()
  {

  }
}

var styles = StyleSheet.create({
  container:{
    flex: 1
  },
  map: {
    flex: 1,
  },
  image: {
    width: 64,
    height: 64
  }
});

module.exports = Map;

Answer 1

Let me show you an example, and hope it helps you.

1.Of course, you can use ES5 feature(createClass) instead of ES6(extends class) method to solve this binding problem.

2.You can keep using ES6, just be careful with binding this. For example in my component

_func1(){
    ...
}

_func2(){
  this._func1()
}

if I want to call _func1() in func2, 'this' is binded to _func2 itself, of course, there is no func1() there.

But if I bind _func2() to component context when I call _func2(), problem will be solved.

<subComponent subProp = {this._func2.bind(this)} />

Hope it helps you.