es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

¿Estoy manejando correctamente los route.params al usar un navigator anidado?

En mi aplicación, tengo un modal que supuestamente debe aparecer si la aplicación detecta que el usuario vino de la pantalla de “FinishingScreen”, de lo contrario, el modal no debería aparecer.

Tengo un “Drawer Tab Navigator” anidado dentro de mi “Main Tab Navigator”.

Cuando navego desde “FinishingScreen” hasta mi “HomeScreen”, el modal aparece porque didComeFromFinishingScreen == true.

Cuando navego a cualquiera de las pantallas contenidas en el Drawer y luego regreso al HomeScreen, el modal vuelve a aparecer porque didComeFromFinishingScreen todavía devuelve true.

Creo que esto tiene que ver con cómo manejo los route.params.

A continuación se muestra el código que uso para manejar los route.params:

Código dentro de FinishingScreen que hace que el modal se active inicialmente

const checkConfirm = async () => {
return await client_instance.stop_running().then(
()=>navigation.navigate(‘Home’, {
didComeFromFinishingScreen: true,
})
)
}



Stop Running

Comprobando si didComeFromFinishingScreen == true dentro de HomeScreen

if(route.params?.didComeFromFinishingScreen){
if(isFocused){
setModalVisible(true)
}
}

return()=>{
console.log(‘La función de limpieza está cerrando el modal’)
if(isFocused){
setModalVisible(false)
}
}

Ir desde HomeScreen a una de las pantallas dentro del Drawer

(

)}
label= {i18n.t(‘prof’)}
onPress={()=>{navigation.navigate(‘ProfileStackScreen’,
{didComeFromFinishingScreen: false}
)}}
/>

Navegando de regreso al HomeScreen desde cualquiera de las pantallas en el Drawer

(

)}
label= {i18n.t(‘home’)}
onPress={()=>{navigation.navigate(‘HomeDrawer’, {
didComeFromFinishingScreen: false})
}}
/>

Tags:  , , , ,

Answer

  1. Avatar for davy.ai

    Para manejar correctamente los route.params en este caso, necesitamos asegurarnos de que el valor de didComeFromFinishingScreen se actualice correctamente al navegar de vuelta a la pantalla de inicio desde cualquiera de las pantallas dentro del Drawer.

    Actualmente, estamos pasando un valor codificado en duro de “false” al navegar de vuelta a la pantalla de inicio desde el Drawer. En su lugar, deberíamos pasar el valor de didComeFromFinishingScreen que recibió la pantalla de inicio al navegar inicialmente desde la pantalla de finalización.

    Para lograr esto, podemos actualizar las funciones onPress de DrawerItem para pasar los route.params recibidos de la pantalla de inicio a la pantalla objetivo, así:

    <draweritem icon="{({color," size="" })=""> (
        <icon name="account-outline" color="{color}" size="{height*0.032}"></icon>
      )}
      label= {i18n.t('prof')}
      onPress={()=>{
        navigation.navigate('ProfileStackScreen', route.params)
      }}
    />
    
    <draweritem icon="{({color," size="" })=""> (
        <icon name="home-outline" color="{color}" size="{height*0.032}"></icon>
      )}
      label= {i18n.t('home')}
      onPress={()=>{
        navigation.navigate('HomeDrawer', route.params)
      }}
    />
    

    Con esta actualización, la pantalla de inicio recibirá el valor correcto de didComeFromFinishingScreen al navegar de vuelta desde el Drawer, lo que nos permitirá alternar correctamente el modal.

Comments are closed.