reactjs - React Accordion 组件，在处理程序后从崩溃中调用钩子

Question

我有一个 React Bootstrap 手风琴组件。在手风琴的每张卡片中都有一个要完成的任务，然后是一个“保存”按钮。此按钮将完成的任务写入数据库。

我还希望保存按钮折叠当前卡并展开下一张卡。我可以通过创建一个调用 useAccordionToggle(eventKey) onClick 的客户 Button 组件来实现这一点（在调用 children 之前）：

function AccordianButton({ children, eventKey }) {
    return (
      <Button
        onClick={useAccordionToggle(eventKey)}
      >
        {children}
      </Button>
    );
  }

到目前为止，一切都很好！

问题是我只想在确定数据库写入成功后折叠手风琴卡。

我想不出办法来做到这一点。如果我尝试在处理函数中调用 useAccordionToggle，我会收到一个钩子错误，因为我在组件之外。有没有办法做到这一点？

Answer 1

我意识到您可以使用 activeKey 参数并使用 React 组件中的状态来驱动它，从而可以从任何地方进行控制。比使用 eventKey 参数容易得多。