1 00:00:02,420 --> 00:00:07,190 Nous voulons envoyer cette action sur l'écran des filtres, bien sûr, car c'est là que 2 00:00:07,190 --> 00:00:08,870 nous définissons tous ces filtres. 3 00:00:08,980 --> 00:00:14,980 En ce moment, nous les gérons ici en état interne et cela restera ainsi car nous avons certainement besoin de 4 00:00:15,430 --> 00:00:17,490 nos filtres là-bas mais maintenant bien 5 00:00:17,680 --> 00:00:21,610 sûr, je veux envoyer une action lorsque le bouton Enregistrer est enfoncé. 6 00:00:21,610 --> 00:00:26,210 Heureusement, j'ai déjà la connexion à l'en-tête configurée avec use use et set params, donc tout ce 7 00:00:26,530 --> 00:00:31,020 que nous avons à faire est de remplacer le journal de la console ici avec dispatch. 8 00:00:31,180 --> 00:00:39,280 Maintenant, bien sûr, pour utiliser la répartition, nous devons d'abord importer le crochet de répartition de l'utilisation ici de React Redux comme 9 00:00:39,330 --> 00:00:41,350 ceci et maintenant nous pouvons 10 00:00:41,350 --> 00:00:46,490 utiliser ce crochet ici pour accéder à la fonction de répartition, donc const répartition 11 00:00:46,910 --> 00:00:51,530 équivaut à utiliser la répartition exécutée en tant que fonction et maintenant 12 00:00:51,530 --> 00:00:57,070 nous pouvons appeler dispatch ici pour distribuer une action et donc nous devons également ajouter 13 00:00:57,070 --> 00:01:01,700 la répartition en tant que dépendance, mais React Redux s'assurera que cela 14 00:01:01,700 --> 00:01:02,910 ne change 15 00:01:02,990 --> 00:01:06,110 jamais, donc cela ne déclenchera jamais un nouveau 16 00:01:06,290 --> 00:01:07,950 rendu, encore, nous devons l'ajouter. 17 00:01:08,120 --> 00:01:23,720 Donc, c'est la répartition, maintenant importante, nous devons également importer mon créateur d'action à partir des repas d'actions de magasin et bien sûr je parle du créateur d'action de filtres définis parce que je dois 18 00:01:23,720 --> 00:01:25,730 l'appeler ici pour créer 19 00:01:25,730 --> 00:01:33,870 une action que je passe pour distribuer là-bas et définissez des filtres une fois que ces filtres appliqués 20 00:01:33,960 --> 00:01:40,170 ont été envoyés et que j'ai sans gluten, sans lactose, végétaliens et qui devraient 21 00:01:40,170 --> 00:01:47,550 être juste végétariens, important, car les clés que vous configurez ici doivent être les clés que vous 22 00:01:47,550 --> 00:01:52,380 recherchez dans votre réducteur sinon cela ne fonctionnera pas, important. 23 00:01:52,380 --> 00:01:55,110 Alors assurez-vous vraiment que ceux-ci 24 00:01:55,110 --> 00:01:58,820 sont égaux, sinon cette logique ne fonctionnera pas. 25 00:01:58,840 --> 00:02:03,370 Alors maintenant, nous distribuons cela chaque fois que le bouton Enregistrer est enfoncé et cela devrait, nous 26 00:02:03,370 --> 00:02:09,220 l'espérons, ajuster nos repas filtrés et cela devrait ensuite être reflété sur l'écran de la catégorie des repas parce que nous 27 00:02:09,220 --> 00:02:12,010 récupérons les repas filtrés. Essayons, sauvons ceci 28 00:02:12,040 --> 00:02:13,340 et 29 00:02:13,750 --> 00:02:17,590 par exemple ce burger, probablement pas végétalien. 30 00:02:18,010 --> 00:02:29,120 Alors passons aux filtres, allumons les végétaliens, sauvegardons ceci et j'obtiens une erreur, je ne trouve pas les actions variables, lancées par le réducteur 31 00:02:29,120 --> 00:02:30,010 de 32 00:02:30,020 --> 00:02:35,710 repas, alors jetons un œil à cela. Oui, ce ne sont pas des actions, bien 33 00:02:35,720 --> 00:02:37,020 sûr c'est de 34 00:02:37,040 --> 00:02:39,230 l'action, c'est le nom de l'argument. 35 00:02:39,230 --> 00:02:40,610 Donc, cela devrait être de 36 00:02:40,610 --> 00:02:42,120 l'action, une erreur mineure, juste une 37 00:02:42,140 --> 00:02:43,150 faute de 38 00:02:43,580 --> 00:02:44,660 frappe, essayons à nouveau. 39 00:02:44,690 --> 00:02:46,220 Revenez aux filtres, activez 40 00:02:46,220 --> 00:02:52,070 les végétaliens, enregistrez cela et allez maintenant aux repas, aux hamburgers et je ne les vois pas ici, ce 41 00:02:52,090 --> 00:02:58,710 qui est bien parce que cela signifie qu'ils sont filtrés. Mes spaghettis à la sauce tomate, 42 00:02:58,710 --> 00:03:04,310 c'est toujours là car évidemment c'est végétalien, au moins c'est sans fromage. 43 00:03:04,500 --> 00:03:07,680 Voilà donc, en allemand le schnitzel est parti, rapide et facile, la 44 00:03:07,670 --> 00:03:10,050 salade est là ce qui a du sens. 45 00:03:10,050 --> 00:03:12,060 Essayons également un autre filtre, sans 46 00:03:12,060 --> 00:03:13,110 gluten, maintenant 47 00:03:13,110 --> 00:03:15,030 les spaghettis devraient avoir disparu, alors 48 00:03:15,030 --> 00:03:16,350 jetons un coup 49 00:03:16,350 --> 00:03:18,150 d'œil, oui, ils sont partis. 50 00:03:18,150 --> 00:03:19,140 La salade est toujours 51 00:03:19,140 --> 00:03:20,030 là, les 52 00:03:20,040 --> 00:03:24,240 spaghettis sont partis, donc cette logique semble fonctionner. Maintenant important, si j'ai désactivé sans 53 00:03:24,450 --> 00:03:32,040 gluten et donc je revois mes spaghettis, si je les ajoute comme favori et ensuite j'ajoute à nouveau ce filtre, bien sûr 54 00:03:32,070 --> 00:03:41,160 sous les repas, ils sont partis, sous les favoris je les vois parce que c'est la logique nous avons mis en place, que les favoris ne prennent 55 00:03:41,160 --> 00:03:46,860 pas de données de nos repas filtrés, mais se soucient simplement de savoir si c'est un 56 00:03:46,860 --> 00:03:48,090 favori ou non. 57 00:03:48,210 --> 00:03:53,370 Vous pouvez bien sûr changer cette logique, mais ici, la logique est ce qu'elle est et seuls les 58 00:03:53,370 --> 00:03:57,980 repas dans les catégories ici sont filtrés en fonction des filtres que vous définissez ici. 59 00:03:58,200 --> 00:04:04,650 Maintenant, ce serait bien d'avoir un joli petit message de repli ici si nous n'avons pas de 60 00:04:05,130 --> 00:04:06,840 données à cause de 61 00:04:06,840 --> 00:04:17,310 nos filtres et donc dans l'écran catégorie repas, je veux aussi vérifier ici si la longueur affichée des repas est nulle, ce qui signifie que je n'ai pas de 62 00:04:17,310 --> 00:04:26,170 repas à afficher et puis je veux retourner une vue ici avec mon texte par défaut là-dedans et cela signifie que nous devons importer 63 00:04:26,170 --> 00:04:34,980 les deux, nous devons importer une vue et nous aurons également besoin de la feuille de style de React Native et importer le composant 64 00:04:35,070 --> 00:04:46,570 de texte par défaut de composants texte par défaut, puis ajoutez un style ici, styles. 65 00:04:50,270 --> 00:04:56,200 le contenu et le texte par défaut que nous affichons pourraient ne pas trouver 66 00:04:56,380 --> 00:04:59,310 de repas, peut-être vérifiez vos filtres, 67 00:04:59,310 --> 00:05:05,630 juste un indice que peut-être vos filtres désactivent les recettes que vous devriez voir ici. 68 00:05:05,640 --> 00:05:13,120 Maintenant, ajoutons simplement les styles constants ici où nous créons une nouvelle feuille de style et là, 69 00:05:13,160 --> 00:05:20,390 je veux configurer cette clé de contenu où j'utilise flex one et puis à nouveau centrer 70 00:05:20,390 --> 00:05:26,640 le contenu horizontalement et verticalement à l'aide de ces propriétés flexbox, comme ça. 71 00:05:28,100 --> 00:05:32,570 Si nous essayons maintenant et peut-être testons cela sur Android, juste pour 72 00:05:32,570 --> 00:05:43,440 mélanger les choses même si c'est un peu plus lent, je peux aller à mes filtres là-bas, mettre du gluten, revenir à mes repas, l'italien donc, ce n'est 73 00:05:43,440 --> 00:05:49,470 pas là donc je reçois ce message. D'un autre côté rapide et facile, là je 74 00:05:49,470 --> 00:05:53,320 prends un repas et donc je ne reçois pas ce message 75 00:05:53,400 --> 00:06:00,140 et donc ça n'a pas l'air trop mal et bien sûr essayons aussi de désactiver ce filtre à 76 00:06:00,160 --> 00:06:05,980 nouveau et revenons, voici les spaghettis . Donc, cela fonctionne maintenant et c'est ainsi que nous pouvons gérer notre état avec Redux.