Ahora echamos un vistazo a la navegación básica con navegar y navegar es su herramienta más importante,
pero en realidad al estar dentro de una pantalla, de un componente cargado con la ayuda de un navegador
de pila, tiene alternativas para navegar.
También puede usar push en lugar de navegar, aunque eso no toma un objeto Javascript, sino que toma solo el
nombre de la ruta aquí,
en este caso, las comidas de categoría como primer argumento y con eso, obtendrá el mismo comportamiento que antes.
La pregunta, por supuesto, es por qué usarías esto.
Número uno, es un poco más corto que navegar porque no estás pasando
un objeto, pero
esa no es la razón principal, sino que usar push aquí puede ser útil si quieres ir a una página donde ya estás.
Ahora déjame mostrarte lo que quiero decir.
Si revierto esto y navego a categorías aquí, entonces a la pantalla de categoría,
que es la pantalla en la que ya estoy. Si hago eso con navegar, lo que verás es
que no pasa nada si toco esto.
Ahora, si uso push en su lugar y, por lo tanto, solo paso categorías como mi primer argumento porque así es como funciona push,
verás que ahora esto funciona y puedo ir a la misma pantalla una y otra vez y se
empuja a la misma pila sobre y otra vez
Ahora, por supuesto, te preguntarás por qué querría presionar la pantalla en la que ya estoy de nuevo.
Ahora, en muchas aplicaciones, es posible que no necesite esto, pero supongamos que está creando una aplicación como Dropbox donde
tiene carpetas entre
las que pueden navegar sus usuarios, si
está en una carpeta, desea ir a otra carpeta.
Ahora, cada carpeta es técnicamente la misma pantalla de carpeta, solo que con contenido diferente cargado. En tal caso, es posible que desee ir de la carpeta
A a la B que usa el mismo componente, la misma pantalla al final pero con contenido diferente,
en tal caso, puede usar la función push para poder seguir presionando esa nueva pantalla que es la
misma pantalla en la pila y carga la misma pantalla con contenido diferente, este sería un escenario en el
que podría necesitar esto. En esta aplicación, no
lo necesitamos, por lo que no es necesario presionar, pero lo tiene en escenarios en los
que la navegación
no lo llevaría a esa pantalla, la presión
siempre lo hará cuando esté dentro de un navegador de pila. Sin embargo, aquí revertiré esto para navegar, que toma un objeto con un nombre de
ruta que luego apunta a categorías porque aquí, absolutamente no necesitamos empuje, eso es comidas de categoría. Esto servirá para esta aplicación, ahora también tiene otras
opciones de
navegación explícitas, digamos desde la pantalla
de comida de categoría, desea poder regresar.
Bueno, por supuesto, podemos regresar con la ayuda de este botón de retroceso, pero tampoco es tan
atípico que en algunas aplicaciones, hay algo más que sus usuarios pueden hacer a donde quieran llevarlos, por
ejemplo, digamos está en una página donde puede configurar algunas configuraciones y cuando hace
clic en el botón Guardar, desea guardar esa configuración y también desea salir de la pantalla.
Ahora, para este escenario, es posible que desee activar una navegación hacia atrás manualmente y no esperar a que
el usuario presione el botón Atrás porque eso podría obligarlo a presionar primero un botón Guardar y luego
regresar manualmente, lo que no La mejor experiencia de usuario.
Así que aquí, simularé esto con solo tener un botón de retroceso aquí en nuestra pantalla, así que
en nuestro código jsx y cuando presionamos esto, quiero poder regresar, quiero activar manualmente
una navegación hacia atrás.
Puede hacer esto con la ayuda del accesorio de navegación porque allí, tiene un método de retroceso al
que puede llamar y esto hace exactamente lo que parece.
Si guardamos esto y voy a las comidas, si hago clic en volver, reproducimos la navegación hacia atrás.
Técnicamente, esto aparece en la pantalla en la que estamos y, por lo tanto,
vuelve a la pantalla anterior en la pila. Como alternativa para volver, si está en un navegador de pila, también
tiene pop que hace lo que su nombre indica, aparece
en la pantalla actual de la pila y, como siempre ve la pantalla superior en su dispositivo, esto también reproduce la navegación hacia atrás,
por lo que esta es una alternativa para regresar. La diferencia es que pop solo se puede usar si
está en
un navegador de pila, volver también está disponible en otros navegadores que usaremos más adelante en este módulo.
A veces, también querrás volver a tu componente
principal, digamos aquí en MealDetailScreen. Allí también podemos agregar un botón
y en este botón aquí, quiero volver a mis
categorías, digamos y, por lo tanto, agregaré onPress y en esta función aquí, puedo usar la navegación de accesorios,
derecha, porque esto nos lleva de vuelta .
Bueno, el problema con eso, por supuesto, es que me lleva de regreso, pero solo a la pantalla antes de esta pantalla, así que a la pantalla.
Vine de. Sin embargo, quiero volver a la pantalla
de categorías, por lo que quiero omitir dos pantallas al mismo tiempo.
Para esto tiene pop to top, este es
otro método al que puede llamar que simplemente emerge de todas las pantallas de la pila y lo lleva de vuelta
a su pantalla raíz.
Entonces, si hace clic en esto, obtenemos la animación de regreso y volvemos a nuestra pantalla raíz, que
en este caso es la
pantalla de categoría, por lo que es una alternativa aquí. Ahora con eso, solo hay una última
acción de navegación posible que a veces pueda necesitar. Digamos que en la pantalla de categorías, desea ir a
las comidas de categoría pero no desea agregarlo a la pila, sino que desea reemplazar su componente actual en la pila con él, de modo
que todavía haya solo una pantalla en la pila, pero esa pantalla es una página nueva, eso también
significa que no podrá
volver a la página nueva porque la pila estaría vacía a partir de entonces, lo
que significa que su aplicación se cierra.
Entonces, en caso de que quiera hacer eso, puede usar replace. Reemplazar también al igual que
la función de empuje toma solo un identificador como este y reemplazar también lo lleva a la nueva pantalla, sin embargo, no reproduce animación
hacia adelante, en cambio, salta instantáneamente allí y no obtiene el botón de retroceso automáticamente porque la
pila está vacía de lo contrario, este es el Solo pantalla.
Esto podría usarse, por ejemplo, en una pantalla de inicio de sesión en la que un usuario inició sesión y una vez
que inició sesión, el usuario no debería poder volver a la
pantalla de inicio de sesión, así que simplemente podría reemplazar la pantalla de inicio de sesión con su sesión iniciada en pantalla con
el perfil de usuario o algo así.
Si aún intentas regresar, no pasa nada porque no puedes regresar, no hay
nada más en la pila. Por lo tanto, por supuesto, reemplazar
no es absolutamente lo que necesitamos en esta aplicación, solo quería presentar esto aquí, aunque veremos más patrones disponibles y cómo ir
y venir entre páginas y cuándo es posible que desee reemplazar o cambiar entre pantallas así
en todo este módulo, solo quería presentarlo ya en este punto, aún aquí, volveré a navegar con
el nombre de la ruta apuntando a las comidas de categoría. Y con eso, tuvo una visión general de algunos de los métodos básicos de navegación
que le permiten ir y venir entre sus pantallas. Como mencioné, por supuesto, veremos muchos patrones en
acción a lo largo de este módulo, por ahora esto es todo y diría que con eso fuera
del camino, es hora de agregar algo de carne a esta aplicación, asegúrese de que sea un aplicación más realista y no
solo una aplicación ficticia como es actualmente.