React Bootstrap - sposób ręcznego zamykania OverlayTrigger

Question

Mam OverlayTrigger owijanie , który zawiera dane wejściowe niektórych formularzy i Button, aby zapisać dane i zamknąć.

save(e) { 
    this.setState({ editing: false }) 
    this.props.handleUpdate(e); 
} 

render() { 
    return (
     <OverlayTrigger trigger="click" 
     rootClose={true} 
     onExit={this.save.bind(this) } 
     show={this.state.editing} 
     overlay={ 
      <Popover title="Time Entry"> 
       <FormGroup> 
        <ControlLabel>Data: </ControlLabel> 
        <FormControl type={'number'}/> 
       </FormGroup> 
       <Button onClick={this.save.bind(this) }>Save</Button> 
      </Popover> 
     }> 

mam rootClose = true, a moja zwrotna zostanie wykonany onExit, ale nie widzę sposobu na ręcznie blisko nakładki. Próbuję użyć atrybutu show z Bootstrap Modal, który (przewidywalnie) nie działa.

Answer 1

Dodaj ref do elementu <OverlayTrigger ref="overlay"... i wywołaj metodę hide po wyrenderowaniu elementu. Nie testowałem tego, ale powinno działać:

this.refs.overlay.hide(); 

Answer 2

Funkcja ukrywania nie jest funkcją publiczną w OverlayTrigger. Ustaw <OverlayTrigger rootClose={true}..., a następnie na wyzwalaczu wywołania zdarzenia document.body.click().