一次只打開一個React-Bootstrap Popover

Question

我使用的是React-Bootstrap Popover，我想知道是否有任何內置屬性可以添加到Popover本身或OverlayTrigger，因此只有一個popover會顯示在時間。

Answer 1

您可以嘗試使用rootClose道具，當用戶在疊加層之外單擊時將觸發onHide。請注意，在這種情況下，onHide是強制性的。例如：

const Example = React.createClass({ 
    getInitialState() { 
    return { show: true }; 
    }, 

    toggle() { 
    this.setState({ show: !this.state.show }); 
    }, 

    render() { 
    return (
     <div style={{ height: 100, position: 'relative' }}> 
     <Button ref="target" onClick={this.toggle}> 
      I am an Overlay target 
     </Button> 

     <Overlay 
      show={this.state.show} 
      onHide={() => this.setState({ show: false })} 
      placement="right" 
      container={this} 
      target={() => ReactDOM.findDOMNode(this.refs.target)} 
      rootClose 
     > 
      <CustomPopover /> 
     </Overlay> 
     </div> 
    ); 
    }, 
});