从popOver内部的按钮关闭react bootstrap popOver组件

Question

如何关闭react功能组件中的react bootstrap popover组件？目前，我正在使用一种破解方法，使用rootclose方法关闭popover，并在里面的按钮上调用body.click，但我觉得这并不理想，在react bootstrap组件中有任何方法或方法吗，或者可能通过使用refs来实现这一点？

**************以下是我的组件现在的结构*****

const setVisibility = (
<Popover id="popover-basic">
<Popover.Body className="px-0">
//code here
</Popover.Body>
</Popover>
);
const EditVisibility = () => (
<OverlayTrigger
trigger="click"
placement="bottom-end"
overlay={setVisibility}
rootClose
>
//code here
</OverlayTrigger>
);

然后我在react函数组件的返回方法中调用EditVisibility组件

Answer 1

请查看愚蠢的沙盒：https://codesandbox.io/s/close-popover-ytpze2

• 引入一个显示状态以控制Popover
• 在Popover.Header中，您可以定义一个关闭按钮，并在单击时将显示状态设置为false
• 编写一个回调函数，在单击按钮时切换Popover(OverlayTrigger的"onToggle"属性(