1 00:00:02,660 --> 00:00:08,660 Entonces, ¿cómo podemos obtener información sobre la categoría en la que hicimos clic, que seleccionamos de esta pantalla 2 00:00:08,660 --> 00:00:15,240 de categoría a la pantalla de comidas de categoría? Bueno, en la pantalla de categorías donde navegamos a las 3 00:00:15,440 --> 00:00:16,870 comidas de categoría, para 4 00:00:16,880 --> 00:00:21,930 esta acción de navegación además del nombre de la ruta, también podemos pasar los parámetros. 5 00:00:21,950 --> 00:00:29,510 Esa es otra clave que este objeto que pasó para navegar acepta y se convierte en un objeto 6 00:00:29,510 --> 00:00:35,060 de pares clave-valor, de cualquier par clave-valor y tantos pares clave-valor como desee. 7 00:00:35,060 --> 00:00:40,980 Estos son simplemente parámetros, datos adicionales que está pasando a la nueva pantalla que se está cargando. 8 00:00:41,330 --> 00:00:46,760 Ahora, puede configurar un parámetro llamado ID de categoría y el nombre depende totalmente de usted, que 9 00:00:46,760 --> 00:00:47,880 podría ser solo 10 00:00:47,930 --> 00:00:54,590 ID, cid o mi hobby, lo que sea que esté creando y los datos que necesite reenviar, aquí lo reenviamos un 11 00:00:54,590 --> 00:00:57,640 ID de categoría, por lo tanto, lo nombraré así. 12 00:00:57,650 --> 00:01:01,410 Esto ahora debería estar en nuestro escenario aquí, por supuesto, la ID 13 00:01:01,410 --> 00:01:03,980 de la categoría en la que hicimos tapping. 14 00:01:03,980 --> 00:01:07,650 Ahora, por supuesto, estamos obteniendo los datos de nuestros elementos aquí para cada elemento de la 15 00:01:07,670 --> 00:01:12,480 cuadrícula que se procesa, esto contiene el elemento y tiene un título, un color y un ID, por lo que la 16 00:01:12,650 --> 00:01:16,780 ID de categoría es itemData. articulo. carné de identidad. 17 00:01:17,180 --> 00:01:23,430 Ahora estamos reenviando esa ID a la nueva pantalla que se está cargando y eso, por supuesto, 18 00:01:23,630 --> 00:01:26,210 es lo importante aquí, esto nos 19 00:01:26,210 --> 00:01:34,620 permite usar esos datos en esa nueva pantalla. ¿Cómo? Bueno, vayamos allí, vayamos a la 20 00:01:34,650 --> 00:01:39,550 pantalla de categorías de comidas y veamos cómo podemos extraer ese parámetro. 21 00:01:39,600 --> 00:01:41,400 Sabemos que obtendremos 22 00:01:41,400 --> 00:01:43,990 uno, ¿cómo podemos obtener acceso ahora? 23 00:01:44,250 --> 00:01:46,740 Para esto, podemos usar nuevamente la navegación 24 00:01:46,740 --> 00:01:52,350 de accesorios, por lo que este accesorio especial que estamos obteniendo porque este componente aquí se está 25 00:01:52,350 --> 00:01:58,860 cargando con la ayuda de un navegador de navegación React y en la navegación, no solo tenemos navegar y empujar, 26 00:01:58,860 --> 00:02:07,410 etc. También tenemos getParam, un método proporcionado para extraer un parámetro que recibimos. getParam toma una cadena con el nombre del parámetro que queremos 27 00:02:07,410 --> 00:02:12,450 extraer y, por supuesto, ese debería ser el nombre que eligió aquí como 28 00:02:12,840 --> 00:02:15,590 clave en ese objeto de parámetros. 29 00:02:15,600 --> 00:02:21,330 Entonces, aquí, agregué ID de categoría, por lo tanto, ese es el nombre que quiero usar aquí. 30 00:02:21,330 --> 00:02:29,160 Esto me dará la ID de gato, esa ID de categoría, Esto me dará el valor que estamos almacenando aquí en ese nombre clave, en este caso, 31 00:02:29,160 --> 00:02:30,350 esa es la ID, 32 00:02:30,360 --> 00:02:30,960 así 33 00:02:30,960 --> 00:02:32,700 que ese es el valor que 34 00:02:32,700 --> 00:02:36,360 estamos extrayendo para la ID de categoría en la categoría pantalla de comidas. 35 00:02:36,360 --> 00:02:44,100 Así que ahora tenemos la identificación del gato y ahora podemos usarla para, por supuesto, tener acceso a todas las comidas que se ajustan 36 00:02:44,100 --> 00:02:45,120 a esta 37 00:02:45,120 --> 00:02:51,360 categoría, en este momento no tenemos comidas, así que tendremos que posponer esto, pero al menos también podemos usar 38 00:02:51,360 --> 00:02:58,920 esto para obtener nuestro título de categoría y usarlo aquí y para eso, todo lo que tenemos que hacer, por supuesto, es importar 39 00:02:58,920 --> 00:03:08,220 categorías, por lo que nuestras categorías se agrupan aquí desde datos / datos ficticios y tenemos la ID, tenemos una matriz de categorías , por supuesto, podemos encontrar 40 00:03:08,220 --> 00:03:15,600 nuestra categoría seleccionada o lo que quiera nombrar al echar un vistazo a las categorías y allí, podemos usar find que toma 41 00:03:15,960 --> 00:03:21,950 una función que se ejecuta en cada elemento de la matriz, así que en cada categoría y nos 42 00:03:21,950 --> 00:03:27,830 da el elemento donde esta función devuelve verdadero, que debería ser el caso si la ID de 43 00:03:27,830 --> 00:03:33,700 la categoría que estamos viendo coincide con la ID del gato que estamos recuperando de nuestros parámetros. 44 00:03:33,800 --> 00:03:35,740 Esto nos da la categoría seleccionada y para demostrar 45 00:03:35,750 --> 00:03:42,010 que esto funciona, lo mostraré aquí en un componente de texto, generaré una categoría seleccionada. 46 00:03:42,020 --> 00:03:53,370 titulo aqui. Ahora con eso, si volvemos y navegamos a esa categoría, vemos italiano aquí justo encima 47 00:03:53,370 --> 00:03:56,280 de mis botones, vemos rápido y fácil ahora, 48 00:03:56,430 --> 00:04:01,310 así que eso está funcionando. Así es como pasamos los 49 00:04:01,410 --> 00:04:07,710 datos hacia adelante y cómo los extraemos y, por supuesto, puede pasar múltiples parámetros, tantos 50 00:04:08,010 --> 00:04:15,270 como necesite y los parámetros no tienen que ser ID, puede pasar objetos, puede pasar texto, números 51 00:04:15,270 --> 00:04:22,620 y matrices, cualquier información que necesite pasar, puede pasarla. Sin embargo, puede notar que, por supuesto, con eso, podemos usar nuestra categoría aquí en 52 00:04:23,040 --> 00:04:25,420 nuestra pantalla, pero queremos usarla aquí en el encabezado. 53 00:04:25,420 --> 00:04:27,030 Bueno, abordemos eso en la próxima conferencia.