Company logo
  • Empleos
  • Bootcamp
  • Acerca de nosotros
  • Para profesionales
    • Inicio
    • Empleos
    • Cursos y retos
    • Preguntas
    • Profesores
    • Bootcamp
  • Para empresas
    • Inicio
    • Nuestro proceso
    • Planes
    • Pruebas
    • Nómina
    • Blog
    • Comercial
    • Calculadora

0

69
Vistas
How do I show a modal box on page load using Chakra UI?

How do I show a modal box on page load using Chakra UI?

I've tried to find this information on Chakra's documentation without success.

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>
        </>
    )
}
7 months ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

You can pass a defaultIsOpen property to the useDisclosure hook to set the default value for isOpen.

Set that property to true to have the modal open on page load.

const { isOpen, onClose } = useDisclosure({ defaultIsOpen: true })
7 months ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos