How to pass data between child and parent in react-native?

Question

module.exports= class APP extends React.Component {
  constructor(props){
    super(props);
    this.state = {
      key1:'key1',
      key2:'key2'
    };
  render() {
    return (
       <View>
          <Button
             onPress={this.goToTisch}>
             1
          </Button>
          <Button
             onPress={this.goToTisch}>
             2
          </Button>
       </View>
    );
  }
}

I just write an app with react-native and do not know how to update the parent state from the child element. thank you in advance

Answer 1

You need to pass from parent to child callback function, and then call it in the child.

For example:

class Parent extends React.Component {
  constructor(props){
    super(props);
    this.state = {
      show: false
    };
  }
  updateState = () => {
      this.setState({
          show: !this.state.show
      });
  }
  render() {
    return (
        <Child updateState={this.updateState} />
    );
  }
}

class Child extends React.Component {
  handleClick = () => {
      this.props.updateState();
  }
  render() {
    return (
        <button onClick={this.handleClick}>Test</button>
    );
  }
}