Estoy trabajando en la implementación de un modal que puede abrir otro modal. Tengo un modal de registro de usuario que tiene un botón "Agregar contacto". Al hacer clic en este botón, aparece "Agregar contacto modal".
AddContactModal es un componente más antiguo y actualmente se llama en el archivo App.js justo encima del componente principal Routes .
<Router forceRefresh={!supportsHistory()}> <div className={appClassNames}> <Providers> <AddContactModal /> <PhoneVerificationModal /> <NavBar currentUser={this.state.currentUser} /> <div className="app-content"> {Routes(actions)} <Footer /> </div> </Providers> </div> </Router> Las Routes(actions) representan la mayor parte de la aplicación. AddContactModal también tiene todas sus funciones declaradas en un archivo de contexto global para que pueda abrirse desde cualquier lugar de la aplicación.
Mi nuevo modal SignUpModal vive en una ruta particular y tiene todas sus funciones en una carpeta local de ganchos.
-src --context ----addContactModalContext.js --scenes ----Contacts -------addContactModal.js ----SignUp ------signUpHooks.js ------signUpModal.jsDebido a la estructura utilizada, puedo llamar a la función para abrir mi modal de contacto desde mi modal de registro. Sin embargo, no puedo reabrir el modal de registro desde el modal de contacto.
Intenté agregar detectores de eventos a la página de registro para escuchar el envío modal de contacto y no tuve éxito.
Sé que podría reestructurar las cosas, pero eso sería un esfuerzo bastante grande.
Esperando que alguien tenga algún consejo. Idealmente, enviar el modal de contacto activaría el modal de registro para que se abra de nuevo SOLO cuando el usuario esté en la página de registro.
Tal vez maneje algún estado para su envío en su contexto, de modo que pueda escucharse con un useEffect en su otro componente y maneje mostrar el modal que necesita. No estoy seguro de si ayudaría, pero tal vez sea una idea nueva.