Chakra Ui Modal - onOpen在组件状态改变之前不会触发

Question

我一直在试图解决这个问题，在过去的4个小时，我从chakra文档中复制了模态代码，当我点击losd模态按钮时，模态不加载，它加载后，我点击任何其他ui元素改变组件状态(强制渲染?)

我使用react 18.2和"@chakra-ui/react"; "^2.2.3"，

我和应用是包裹在脉轮供应商更新包使用中央

我也试过使用useEffect，没有运气，我试过在App.tsx中使用组件，也没有运气。

import { Button, Divider, Flex, Modal, ModalBody, ModalCloseButton, ModalContent, ModalFooter, ModalHeader, ModalOverlay, Text, useDisclosure } from "@chakra-ui/react";
export default function BuyerQrConfirm({ ...props }: any) {
const { isOpen, onOpen, onClose } = useDisclosure()
return (
<>
<Button onClick={onOpen}>Open Modal</Button>
<Modal isOpen={isOpen} onClose={onClose} >
<ModalOverlay />
<ModalContent>
<ModalHeader>Modal Title</ModalHeader>
<ModalCloseButton />
<ModalBody>
</ModalBody>
<ModalFooter>
<Button colorScheme='blue' mr={3} onClick={onClose}>
Close
</Button>
<Button variant='ghost'>Secondary Action</Button>
</ModalFooter>
</ModalContent>
</Modal >
</>
)
}

Answer 1

仅供参考，我和你有同样的问题。我正在使用NextJS并在nextconfig文件中禁用react严格模式。

Answer 2

chakra开发人员已经在2.2.4版本中修复了这个问题，您应该将chakra包更新到最后一个版本，然后再次添加StrictMode，这是问题:

https://github.com/chakra-ui/chakra-ui/issues/6317