[Solved]-Open a modal from a component-Reactjs

constructor (props) {
    super(props);
    this.state = {
      displayModal : false
    }
  }

  render () {
    return (
      <div style={{visibility : this.state.displayModal === true ? 'visible' : 'hidden'}}>
          <p>Pop up: Bet Behind Settings</p>
      </div>
      <button onClick={this._toggleModal}>CLICK</button>
    )
  }

  _toggleModal = () => {
    const current = this.state.displayModal;
    this.setState({
      displayModal : !current
    }); 
  }

import { Layer, LayerContext } from 'react-layer-stack'
// ... for each `object` in array of `objects`
const modalId = 'DeleteObjectConfirmation' + objects[rowIndex].id
return (
    <Cell {...props}>
        // the layer definition. The content will show up in the LayerStackMountPoint when `show(modalId)` be fired in LayerContext
        <Layer use={[objects[rowIndex], rowIndex]} id={modalId}> {({
            hideMe, // alias for `hide(modalId)`
            index } // useful to know to set zIndex, for example
            , e) => // access to the arguments (click event data in this example)
          <Modal onClick={ hideMe } zIndex={(index + 1) * 1000}>
            <ConfirmationDialog
              title={ 'Delete' }
              message={ "You're about to delete to " + '"' + objects[rowIndex].name + '"' }
              confirmButton={ <Button type="primary">DELETE</Button> }
              onConfirm={ this.handleDeleteObject.bind(this, objects[rowIndex].name, hideMe) } // hide after confirmation
              close={ hideMe } />
          </Modal> }
        </Layer>

        // this is the toggle for Layer with `id === modalId` can be defined everywhere in the components tree
        <LayerContext id={ modalId }> {({showMe}) => // showMe is alias for `show(modalId)`
          <div style={styles.iconOverlay} onClick={ (e) => showMe(e) }> // additional arguments can be passed (like event)
            <Icon type="trash" />
          </div> }
        </LayerContext>
    </Cell>)
// ...

render() {
  var returnIt;
  if (this.state.hide) {
    returnIt = null;
  } else {
    returnIt = (
      <div style={{visibility : this.state.displayModal}}>
      <p>Pop up: Bet Behind Settings</p>
      </div>
      <button onClick={this._openModal}>CLICK</button>      
    )
  }
  return (returnIt);
}