Así que trabajemos en portar toda nuestra lógica aquí en el navegador de aplicaciones.
Comenzamos con esta pila ficticia aquí y eso es bueno, pero en última instancia no es lo que necesitamos.
Ahora depende de usted hacer esa configuración, pero ya que lo hicimos básicamente en el archivo del navegador de
la tienda antes.
También lo seguiré haciendo allí.
Incluso con esa nueva lógica.
Entonces, lo que haré es un navegador de aplicaciones.
De hecho, eliminaré mi pila aquí y eliminaré esta importación y eliminaré esto aquí. Sin
embargo, dejaré el contenedor de navegación y restableceré esta importación, aunque finalmente cambiará esto
un poco.
Pero ahora pasemos al navegador de la tienda, en primer lugar, podemos eliminar esta importación de la navegación de
reacción, no la necesitará.
Dejemos el resto por ahora, sin embargo, en lugar de esa importación eliminada, podemos importar desde la pila de navegación
de reacción y todo ya es desde el sorteo y desde la pila de anuncios importamos crear el navegador de pila desde el dibujo
de barra, importamos crear el navegador de dibujo.
Ahora podemos desplazarnos hacia abajo y podemos dejar las opciones de navegación predeterminadas aquí en realidad.
Afortunadamente, el nombre suena y cómo generalmente configuras las cosas y lo que puedes configurar realmente no
cambió, solo cómo aplicas la configuración cambiada y, por lo tanto, lo que definitivamente necesita
cambiar es esta parte aquí, nuestro primer navegador de pila, por ahora duplicado y luego eliminado comenté para tener una comparación lado a lado.
Crearé una nueva constante que nombraré el navegador de pila de productos solo para que no tengamos
un choque de nombres y que sea realmente obvio que esto
mantendrá una pila de páginas. pantallas y lo hacemos con crear un navegador de pila con esta función,
lo que le mostré antes de que esta función ya no tome parámetros, en su lugar crearé una nueva constante aquí productos
Navigator.
Así que ahora tenemos un choque de nombres, pero esto se eliminará de todos modos.
Y este es ahora un componente de reacción del componente funcional y podríamos bajar todo
lo almacenado en un archivo separado solo para esta comparación lado a lado y porque teníamos
todo en este archivo antes, ahora configuraré todos estos componentes del navegador con nuestra navegación configuración aquí
en este único archivo dividirlo definitivamente es algo que podría considerar.
Así que aquí está nuestro navegador de productos y ahora devolveré los productos stack navigator dot Navigator
como aprendieron y en sus productos stack navigator dot screen y teníamos tres pantallas antes, así que replicaré
esto dos veces.
Entonces, ¿teníamos tres pantallas allí?
Ahora podemos configurarlos, asignemos un nombre a la primera pantalla y será una descripción general de los productos.
Ahora el componente que debe cargarse es nuestro componente de pantalla de resumen de productos.
Básicamente, lo que mapeamos antes también ahora para la segunda pantalla, el nombre es el detalle del producto.
Entonces, lo que teníamos aquí y asegúrate de mantener esos nombres para que
toda la lógica de navegación que tienes en tu aplicación no tenga que cambiarse para que esto todavía
funcione y aquí el componente que debe cargarse cuando queremos llegar esa pantalla es el componente
detallado de la pantalla del producto, así como teníamos allí abajo, reformulemos eso y para la última pantalla el nombre es carrito.
Lo que teníamos aquí y queremos ir a la pantalla del corazón así como así.
Así que ahora configuramos esta pila de navegación con esta nueva lógica basada en componentes.
Ahora podemos importar en el navegador de aplicaciones y para papá solo tenemos que
agregar una palabra clave de exportación delante para que esta constante este componente se exporte aquí en este archivo y
en el navegador de aplicaciones que ahora no importamos el navegador de la tienda, pero importamos importamos el navegador de productos recién exportados que aquí y en
nuestro contenedor de navegación ahora podemos agregar el navegador de productos de esta manera y podemos deshacernos de la
importación de la pantalla de información general del producto.
Ahora de vuelta al navegador de la tienda.
Echemos un vistazo a esas opciones.
A continuación, las opciones de navegación que teníamos aquí en esta pila.
Que hacemos con eso.
Bueno, en realidad tenemos dos opciones aquí en nuestro navegador de productos en el navegador antiguo con la lógica
anterior: el icono de hecho.
Esta pila debe tener en el cajón que agregaremos más tarde, el segundo son nuestras opciones de navegación predeterminadas que
deben aplicarse a todas las pantallas que forman parte de este navegador.
Y, de hecho, también hay un tercer lugar donde configuramos cosas en el pasado.
Y eso fue en algunas de las pantallas.
Echemos un vistazo a nuestra pantalla de resumen del producto que hay en la carpeta de la tienda allí si nos desplazamos hacia abajo.
Teníamos esta propiedad de opciones de navegación que agregamos al objeto funcional de la pantalla de vista general de productos y esa era una función
en la que configuramos cosas como el título del encabezado, pero también lo que está a la
izquierda y al conjunto derecho del encabezado ahora con esta nueva lógica.
Ya no haces eso así.
En cambio, podemos copiar todo este conjunto aquí.
Entonces, todo eso podemos copiarlo.
Podemos comentarlo aquí en el componente de pantalla e ir al componente del navegador de aplicaciones.
Disculpe por comprar el componente del navegador donde configuramos nuestra navegación de pila y ahora
en la pantalla donde queremos tener esas opciones podemos agregar un tercer accesorio y esa es la propiedad de opciones y dos opciones.
Puede analizar exactamente lo que tenía en el componente antes, por lo que pasar de función hace es una función
correcta.
El cual recibe el
parámetro de datos NAF que luego devuelve un objeto de configuración, el valor concreto para este parámetro será alimentado
por la navegación de reacción y los nombres de configuración que podemos establecer aquí, las cosas que podemos configurar no han
cambiado.
Entonces todavía podemos configurar un título de encabezado adelante o izquierda.
Entonces todo esto es exactamente lo mismo que aprendiste.
Funciona exactamente de la misma manera.
Afortunadamente ahora podríamos hacer eso aquí y comprar navegador.
Pero, por supuesto, esto rápidamente se volvería muy grande si tuviéramos todas las configuraciones específicas
de pantalla diferentes aquí.
Entonces, en realidad no es lo que haré aquí.
En cambio, veo dos opciones.
Una es que realmente hacemos nuestra configuración desde la pantalla del navegador de la pila de productos en el componente de pantalla.
El segundo es que simplemente mantenemos nuestras opciones allí y ese es el enfoque que seguiré.
Entonces, en la descripción general del producto, comentaré esto nuevamente, pero ahora aquí ya no establecemos que funcione como un valor
para el accesorio de opciones de navegación, sino que simplemente lo exportamos como una constante, una constante a la que tenemos que
dar un nombre y yo ' Nombraré estas opciones de pantalla. Ninguna opción de pantalla contiene esta función y la exportamos por
su nombre.
No choca con la exportación del componente porque lo hacemos con el valor predeterminado aquí.
Entonces, ahora exportamos su función de configuración y luego el navegador de la tienda, por lo tanto, podemos importarla, así que
además de importar la pantalla de resumen de productos desde ese archivo, ahora también podemos combinar
eso con una importación con nombre donde importamos a la función de opciones de pantalla y luego aquí dos opciones en esta pantalla
Acabo de pasar un puntero a esta función, no lo ejecuto, solo lo apunté.
Reaccionemos la navegación ejecutada por usted para que pueda encajar en el valor
concreto de esta función de parámetros de datos NAF una vez y con esto se configura esta pantalla.
Ahora, si guardamos ese conflicto de anuncios porque tenemos este nombre de conflicto ahí abajo.
Entonces, para resolver esto, asegurémonos de que todos admitamos las otras opciones.
Ahora, la opción específica de dibujar es algo que veré más adelante una vez que agreguemos un dibujo para las
opciones de navegación predeterminadas.
La buena noticia es que aún podemos aplicar aquellos que no tenemos que configurar todo en un nivel de pantalla.
Si tenemos una configuración compartida que afecta a todas las pantallas de un navegador.
¿Y cómo crees que podemos configurar opciones generales para todas estas pantallas gratuitas aquí?
Bueno, los configuramos directamente en el navegador allí.
También tenemos una pequeña propiedad de opciones de pantalla, por lo que no son opciones con nombre, sino opciones de pantalla.
Pero estas son las opciones que se aplicarán a cada pantalla aquí y las opciones específicas de la
pantalla se fusionarán con estas opciones generales al igual que antes en el curso.
Ahora aquí pasamos nuestro objeto de opciones de navegación predeterminado.
Entonces, este objeto allí arriba solo lo introduzco como un valor para las opciones de pantalla y eso es todo.
Ahora podemos comentar como navegador de productos aquí y guardar todo.
Ahora, una vez que hacemos eso, todavía no podemos ver el resultado porque en este archivo de navegador de la tienda todavía tenemos
un montón de código que usa el navegador antiguo o la lógica del navegador anterior y eso está causando un problema aquí.
Ahora para ver un resultado, comentaré temporalmente todo esto temporalmente y guardaré nuevamente.
Para que esto se reconstruya y vea, ahora tenemos un error.
Bueno, hay una cosa que realmente necesitamos ajustar y el componente de descripción general del producto en nuestro encabezado de
dirección de opción de pantalla a la izquierda.
Esto ahora debe ser una función aquí que devuelva nuestro marcado JSA X y lo mismo para el encabezado derecho.
Por lo tanto, debemos convertir ambas en funciones y simplemente puede hacerlo agregando una lista de parámetros vacía y
luego la flecha aquí.
Nota al margen: podría aceptar el parámetro aquí si lo deseara, y eso serían accesorios porque en realidad
ahora es un componente de reacción que encuentra aquí un valor concreto para los accesorios
y se alimenta mediante la navegación de reacción y los valores que puede obtener desde allí pueden
ser encontrado en los documentos oficiales con este ajuste realizado si ahora estamos seguros, ahora se reinicia aquí y ahora vemos esa pantalla nuevamente.
Ahora definitivamente retoma nuestra configuración.
Tenga en cuenta que el sorteo no funcionará porque aún no hemos agregado sorteo y navegación, así
que con todo eso aprendimos cómo podemos configurar nuestros componentes en nuestras pantallas y el navegador general de
la pila con esa nueva lógica.
Es hora de seguir portando Definitivamente, siéntase libre de hacer los siguientes pasos por su cuenta y un puerto
para seleccionar opciones específicas para el detalle del producto y la pantalla de la tarjeta y luego pasaremos a la siguiente
pila.
Y luego, por supuesto, también demandar en el sorteo.