如何以编程方式关闭 chakra Ui 中的抽屉

Posted 2023-03-21

技术标签:

【中文标题】如何以编程方式关闭 chakra Ui 中的抽屉【英文标题】：How to close drawer in chakra Ui programmatically 【发布时间】：2021-04-10 07:22:37 【问题描述】：

Chakra Ui 提供披露

  const  isOpen, onOpen, onClose  = useDisclosure();

在文档中这个按钮将关闭抽屉

<Button variant="outline" mr=3 onClick=onClose>
   Cancel
</Button>

他们没有提供类似 close() 函数来以编程方式关闭它，或者我错过了什么

【问题讨论】：

【参考方案1】：

onClose 是 chakra-ui 提供的功能，它将关闭抽屉或任何由 chakra-ui 打开的门户。 onClose 的行为仅类似于 close() 函数。

【讨论】：

【参考方案2】：

当你想打开抽屉时使用onClick里面的onOpen函数或者你想要的，当你想关闭抽屉时使用onClick里面的onClose或者你想要的。别担心，这些都有处理抽屉的代码。

【讨论】：

【参考方案3】：

在onClick=中传递onClose，不要忘记在onClose后面加上()，防止出错

onClose()>X

【讨论】：

以上是关于如何以编程方式关闭 chakra Ui 中的抽屉的主要内容，如果未能解决你的问题，请参考以下文章