React – Quick solution to update the parent component when the child’s state has changed

The following answer was a quick and good solution for updating the parent component when the child’s state has changed.

class Parent extends React.Component {
  constructor(props) {
    super(props)

    this.handler = this.handler.bind(this)
  }

  handler(e) {
    e.preventDefault()
    this.setState({
      someVar: someValue
    })
  }

  render() {
    return <Child handler = {this.handler} />
  }
}

class Child extendes React.Component {
  render() {
    return <Button onClick = {this.props.handler}/ >
  }
}Code language: JavaScript (javascript)

Sources:

Tags