我如何显示一个模态框页面加载使用脉轮用户界面?
我试着在脉轮的文档中找到这些信息,但没有成功。
import {
useDisclosure,
Modal,
ModalOverlay,
ModalContent,
ModalCloseButton,
ModalBody,
Text,
} from "@chakra-ui/react"
export default function BasicUsage() {
const { isOpen, onClose } = useDisclosure()
return (
<>
<Modal isOpen={isOpen} onClose={onClose}>
<ModalOverlay />
<ModalContent>
<ModalCloseButton />
<ModalBody>
<Text>Hello</Text>
</ModalBody>
</ModalContent>
</Modal>
</>
)
}
2条答案
按热度按时间jdzmm42g1#
您可以将
defaultIsOpen
属性传递给useDisclosure
挂钩,以设置isOpen
的默认值。将该属性设置为
true
以在页面加载时打开模态。ht4b089n2#
juliomalves提到的解决方案正在工作(顺便感谢),但是默认情况下它只在第一次打开。
假设我有下面的代码,它只会在第一次显示,但我想在每次进入按钮单击方法时打开对话框:
其中:
模态对话框位于不同的组件中,我在其中设置:
使用这段代码,当我点击按钮,它会检查剩余的尝试,如果0(或负),它会显示模态。但当我关闭模态,并再次点击按钮,它不会打开模态。有人有一个解决方案吗?(抱歉,我没有直接回复juliomalves,但显然我需要更多的声誉回复/评论)。