Tengo una página modal que aparece cuando el usuario hace clic en un botón, funciona perfectamente:
render() { return ( <div> <section> <button onClick={() => this.refs.simpleDialog.show()}>Open Modal</button> </section> <SkyLight hideOnOverlayClicked ref="simpleDialog" title="Test Modal"> Text that appears inside the modal page <Button onClick={() => this.refs.simpleDialog.hide()} >Got It</Button> </SkyLight> </div> )}Pero Mi objetivo es abrir el modal automáticamente cuando el usuario abre la página por primera vez.
No quiero abrir la página modal haciendo clic en un botón
Pregunta :
¿Puedo usar un IIFE (una expresión de función invocada inmediatamente) para abrir el modal tan pronto como el usuario abra la página?
Mi enfoque fue establecer un booleano en verdadero. Luego abra el modal si el valor se establece en verdadero
Biblioteca que se utiliza para el modal: https://github.com/marcio/react-skylight
Creo que lo que estás buscando es el método de ciclo de vida del componenteDidMount() :
componentDidMount() { this.refs.simpleDialog.show(); }De los documentos de React :
componentDidMount()se invoca inmediatamente después de montar un componente. La inicialización que requiere nodos DOM debe ir aquí. Si necesita cargar datos desde un extremo remoto, este es un buen lugar para instanciar la solicitud de red. Establecer el estado en este método activará una nueva representación.
No dude en consultar otros métodos de ciclo de vida de los componentes .
Para tener un modelo abierto en el montaje de componentes, simplemente establezca isVisible en verdadero
<SkyLight isVisible={true} ref="simpleDialog" title="Test Modal">