一次只打开一个React-Bootstrap Popover

Question

我正在使用React-Bootstrap Popover，我想知道是否有任何内置属性可以添加到Popover本身或OverlayTrigger，因此一次只能显示一个popover。

Answer 1

当用户点击叠加层外部时，您可以尝试rootClose道具会触发onHide。请注意，在这种情况下，onHide是强制性的。 e.g：

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>
    );
  },
});