score:4

Accepted answer
var ModalParent = React.createClass({
  getInitialState: function() {
    return {showModal: false};
  },

  toggleShowModal: function() {
    this.setState({showModal: !this.state.showModal});
  },

  render: function() {
    return (
      <div>
        <button type="button" onClick={this.toggleShowModal.bind(this)}>Toggle Show Modal</button>
        {this.state.showModal ? 
            <Modal onModalClose={this.toggleShowModal.bind(this)}/> : 
            <div></div>}
        <h4>State is: </h4>
        <pre>{JSON.stringify(this.state, null, 2)}</pre>
      </div>);
  }
});

var Modal = React.createClass({
  render: function(){
    return <div><button type="buton" onClick={this.props.onModalClose}>Close</button></div>
  }
});

ReactDOM.render(<ModalParent/>, document.getElementById("app"));

score:2

class Modal extends Component {

  updateParent(){
    this.props.toggleShowModalCallback()
  }

  render(){
    return(
    <CloseModalButton onClick={this.updateParent.bind(this)} />
    )
  }
}

Related Query

More Query from same tag