1 00:00:02,420 --> 00:00:07,190 Queremos enviar esta acción en la pantalla de filtros, por supuesto, porque allí es donde 2 00:00:07,190 --> 00:00:08,870 configuramos todos estos filtros. 3 00:00:08,980 --> 00:00:14,980 En este momento, los administramos aquí en estado interno y eso se mantendrá de esta manera porque definitivamente necesitamos 4 00:00:15,430 --> 00:00:17,490 nuestros filtros allí, pero ahora, 5 00:00:17,680 --> 00:00:21,610 por supuesto, quiero enviar una acción cuando se presiona el botón Guardar. 6 00:00:21,610 --> 00:00:26,210 Afortunadamente, ya tengo la conexión al encabezado configurada con efecto de uso y establecer parámetros, por lo que 7 00:00:26,530 --> 00:00:31,020 todo lo que tenemos que hacer es reemplazar el registro de la consola aquí con el despacho. 8 00:00:31,180 --> 00:00:39,280 Ahora, por supuesto, para usar el despacho, primero tenemos que importar el gancho de despacho de uso aquí de React Redux de esta 9 00:00:39,330 --> 00:00:41,350 manera y ahora podemos usar 10 00:00:41,350 --> 00:00:46,490 ese gancho aquí para obtener acceso a la función de despacho, por lo que 11 00:00:46,910 --> 00:00:51,530 el despacho constante equivale a usar el despacho ejecutado como una función y 12 00:00:51,530 --> 00:00:57,070 ahora podemos llamar al despacho aquí para despachar una acción y, por lo tanto, también necesitamos 13 00:00:57,070 --> 00:01:01,700 agregar el despacho como una dependencia, pero React Redux se asegurará de que 14 00:01:01,700 --> 00:01:02,910 esto nunca 15 00:01:02,990 --> 00:01:06,110 cambie, por lo que esto nunca desencadenará una nueva 16 00:01:06,290 --> 00:01:07,950 representación, aún, Tenemos que agregarlo. 17 00:01:08,120 --> 00:01:23,720 Eso es despacho, ahora importante, también necesitamos importar mi creador de acciones de las comidas de acciones de la tienda y, por supuesto, estoy hablando del creador de acciones de filtros establecidos porque necesito 18 00:01:23,720 --> 00:01:25,730 llamar a eso aquí 19 00:01:25,730 --> 00:01:33,870 para crear una acción que paso para despachar allí y establezca filtros una vez que este filtro aplicado 20 00:01:33,960 --> 00:01:40,170 objete que reenvío y allí tengo sin gluten, sin lactosa, vegano y eso debería 21 00:01:40,170 --> 00:01:47,550 ser vegetariano, importante, porque las claves que configura aquí deben ser las claves que está buscando 22 00:01:47,550 --> 00:01:52,380 en su reductor de lo contrario, esto no funcionará, importante. 23 00:01:52,380 --> 00:01:55,110 Así que asegúrese de que 24 00:01:55,110 --> 00:01:58,820 sean iguales, de lo contrario esta lógica no funcionará. 25 00:01:58,840 --> 00:02:03,370 Así que ahora estamos enviando esto cada vez que se presiona el botón Guardar y esperamos 26 00:02:03,370 --> 00:02:09,220 que esto ajuste nuestras comidas filtradas y que luego se refleje en la pantalla de comidas de categoría porque estamos 27 00:02:09,220 --> 00:02:12,010 recuperando las comidas filtradas. Intentemos, guardemos esto 28 00:02:12,040 --> 00:02:13,340 y, 29 00:02:13,750 --> 00:02:17,590 por ejemplo, esta hamburguesa, probablemente no vegana. 30 00:02:18,010 --> 00:02:29,120 Así que vayamos a los filtros, activemos vegan, guardemos esto y obtengo un error, no puedo encontrar acciones variables, lanzadas por el reductor de 31 00:02:29,120 --> 00:02:30,010 comidas, 32 00:02:30,020 --> 00:02:35,710 así que echemos un vistazo a eso. Sí, no son acciones, por supuesto, es 33 00:02:35,720 --> 00:02:37,020 acción, ese 34 00:02:37,040 --> 00:02:39,230 es el nombre del argumento. 35 00:02:39,230 --> 00:02:40,610 Eso debería ser acción, un 36 00:02:40,610 --> 00:02:42,120 error menor, solo un error 37 00:02:42,140 --> 00:02:43,150 tipográfico, vamos 38 00:02:43,580 --> 00:02:44,660 a intentarlo de nuevo. 39 00:02:44,690 --> 00:02:46,220 Vuelva a los filtros, 40 00:02:46,220 --> 00:02:52,070 encienda el vegano, guarde esto y ahora vaya a las comidas, las hamburguesas y no las veo aquí, 41 00:02:52,090 --> 00:02:58,710 lo cual es bueno porque eso significa que está filtrado. Mi espagueti con salsa de tomate, todavía 42 00:02:58,710 --> 00:03:04,310 está ahí porque obviamente eso es vegetariano, al menos esto es sin queso. 43 00:03:04,500 --> 00:03:07,680 Así que ahí está, en alemán el escalope se ha ido, rápido y 44 00:03:07,670 --> 00:03:10,050 fácil, la ensalada está ahí, lo que tiene sentido. 45 00:03:10,050 --> 00:03:12,060 Probemos también con otro filtro, sin 46 00:03:12,060 --> 00:03:13,110 gluten, ahora 47 00:03:13,110 --> 00:03:15,030 los espaguetis deberían desaparecer con seguridad, 48 00:03:15,030 --> 00:03:16,350 así que echemos un 49 00:03:16,350 --> 00:03:18,150 vistazo, sí, se han ido. 50 00:03:18,150 --> 00:03:19,140 La ensalada todavía está allí, 51 00:03:19,140 --> 00:03:20,030 los espaguetis se 52 00:03:20,040 --> 00:03:24,240 han ido, por lo que esta lógica parece funcionar. Ahora es importante, si desactivé 53 00:03:24,450 --> 00:03:32,040 sin gluten y, por lo tanto, vuelvo a ver mis espaguetis, si los agrego como favoritos y luego agrego 54 00:03:32,070 --> 00:03:41,160 este filtro nuevamente, por supuesto, en las comidas, desaparecen, en favoritos los veo porque esa es la lógica configuramos que los favoritos no 55 00:03:41,160 --> 00:03:46,860 toman datos de nuestras comidas filtradas, sino que se preocupan por si son favoritos 56 00:03:46,860 --> 00:03:48,090 o no. 57 00:03:48,210 --> 00:03:53,370 Por supuesto, podría cambiar esta lógica, pero aquí la lógica es lo que es y solo las 58 00:03:53,370 --> 00:03:57,980 comidas en las categorías aquí se filtran de acuerdo con los filtros que configure aquí. 59 00:03:58,200 --> 00:04:04,650 Ahora sería bueno tener un pequeño mensaje de reserva aquí si no tenemos datos debido a 60 00:04:05,130 --> 00:04:06,840 nuestros filtros y, 61 00:04:06,840 --> 00:04:17,310 por lo tanto, en la pantalla de comidas de categoría, también quiero verificar si la duración de las comidas es cero, lo que significa que no 62 00:04:17,310 --> 00:04:26,170 tengo comidas para mostrar y luego quiero devolver una vista aquí con mi texto predeterminado allí en realidad y eso significa que 63 00:04:26,170 --> 00:04:34,980 necesitamos importar ambos, necesitamos importar una vista y también necesitaremos la hoja de estilo de React Native e importar el componente de 64 00:04:35,070 --> 00:04:46,570 texto predeterminado de componentes de texto predeterminado y luego agregue un estilo aquí, estilos. 65 00:04:50,270 --> 00:04:56,200 el contenido y el texto predeterminado que mostramos podrían no ser comidas encontradas, tal 66 00:04:56,380 --> 00:04:59,310 vez verifique sus filtros, solo una 67 00:04:59,310 --> 00:05:05,630 pista de que tal vez sus filtros están desactivando las recetas que debería ver aquí. 68 00:05:05,640 --> 00:05:13,120 Ahora agreguemos esos estilos constantes aquí donde creamos una nueva hoja de estilos y allí, quiero 69 00:05:13,160 --> 00:05:20,390 configurar esa clave de contenido donde uso flex one y luego centrar nuevamente el contenido 70 00:05:20,390 --> 00:05:26,640 horizontal y verticalmente con la ayuda de estas propiedades de flexbox, así. 71 00:05:28,100 --> 00:05:32,570 Si ahora lo intentamos y tal vez lo probamos en Android, solo 72 00:05:32,570 --> 00:05:43,440 para mezclar las cosas a pesar de que es un poco más lento, puedo ir a mis filtros allí, establecer sin gluten, volver a mis comidas, italiano, por lo tanto, esto 73 00:05:43,440 --> 00:05:49,470 no es allí, así que recibo este mensaje. Por otro lado, rápido y fácil, allí tengo 74 00:05:49,470 --> 00:05:53,320 una comida y, por lo tanto, no recibo este mensaje 75 00:05:53,400 --> 00:06:00,140 y, por lo tanto, esto no se ve tan mal y, por supuesto, intentemos deshabilitar este filtro nuevamente 76 00:06:00,160 --> 00:06:05,980 y volver, aquí están los espaguetis . Así que ahora todo funciona y así es como podemos administrar nuestro estado con Redux.