Nous voulons envoyer cette action sur l'écran des filtres, bien sûr, car c'est là que
nous définissons tous ces filtres.
En ce moment, nous les gérons ici en état interne et cela restera ainsi car nous avons certainement besoin de
nos filtres là-bas mais maintenant bien
sûr, je veux envoyer une action lorsque le bouton Enregistrer est enfoncé.
Heureusement, j'ai déjà la connexion à l'en-tête configurée avec use use et set params, donc tout ce
que nous avons à faire est de remplacer le journal de la console ici avec dispatch.
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
ceci et maintenant nous pouvons
utiliser ce crochet ici pour accéder à la fonction de répartition, donc const répartition
équivaut à utiliser la répartition exécutée en tant que fonction et maintenant
nous pouvons appeler dispatch ici pour distribuer une action et donc nous devons également ajouter
la répartition en tant que dépendance, mais React Redux s'assurera que cela
ne change
jamais, donc cela ne déclenchera jamais un nouveau
rendu, encore, nous devons l'ajouter.
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
l'appeler ici pour créer
une action que je passe pour distribuer là-bas et définissez des filtres une fois que ces filtres appliqués
ont été envoyés et que j'ai sans gluten, sans lactose, végétaliens et qui devraient
être juste végétariens, important, car les clés que vous configurez ici doivent être les clés que vous
recherchez dans votre réducteur sinon cela ne fonctionnera pas, important.
Alors assurez-vous vraiment que ceux-ci
sont égaux, sinon cette logique ne fonctionnera pas.
Alors maintenant, nous distribuons cela chaque fois que le bouton Enregistrer est enfoncé et cela devrait, nous
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
récupérons les repas filtrés. Essayons, sauvons ceci
et
par exemple ce burger, probablement pas végétalien.
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
de
repas, alors jetons un œil à cela. Oui, ce ne sont pas des actions, bien
sûr c'est de
l'action, c'est le nom de l'argument.
Donc, cela devrait être de
l'action, une erreur mineure, juste une
faute de
frappe, essayons à nouveau.
Revenez aux filtres, activez
les végétaliens, enregistrez cela et allez maintenant aux repas, aux hamburgers et je ne les vois pas ici, ce
qui est bien parce que cela signifie qu'ils sont filtrés. Mes spaghettis à la sauce tomate,
c'est toujours là car évidemment c'est végétalien, au moins c'est sans fromage.
Voilà donc, en allemand le schnitzel est parti, rapide et facile, la
salade est là ce qui a du sens.
Essayons également un autre filtre, sans
gluten, maintenant
les spaghettis devraient avoir disparu, alors
jetons un coup
d'œil, oui, ils sont partis.
La salade est toujours
là, les
spaghettis sont partis, donc cette logique semble fonctionner. Maintenant important, si j'ai désactivé sans
gluten et donc je revois mes spaghettis, si je les ajoute comme favori et ensuite j'ajoute à nouveau ce filtre, bien sûr
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
pas de données de nos repas filtrés, mais se soucient simplement de savoir si c'est un
favori ou non.
Vous pouvez bien sûr changer cette logique, mais ici, la logique est ce qu'elle est et seuls les
repas dans les catégories ici sont filtrés en fonction des filtres que vous définissez ici.
Maintenant, ce serait bien d'avoir un joli petit message de repli ici si nous n'avons pas de
données à cause de
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
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
les deux, nous devons importer une vue et nous aurons également besoin de la feuille de style de React Native et importer le composant
de texte par défaut de composants texte par défaut, puis ajoutez un style ici, styles.
le contenu et le texte par défaut que nous affichons pourraient ne pas trouver
de repas, peut-être vérifiez vos filtres,
juste un indice que peut-être vos filtres désactivent les recettes que vous devriez voir ici.
Maintenant, ajoutons simplement les styles constants ici où nous créons une nouvelle feuille de style et là,
je veux configurer cette clé de contenu où j'utilise flex one et puis à nouveau centrer
le contenu horizontalement et verticalement à l'aide de ces propriétés flexbox, comme ça.
Si nous essayons maintenant et peut-être testons cela sur Android, juste pour
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
pas là donc je reçois ce message. D'un autre côté rapide et facile, là je
prends un repas et donc je ne reçois pas ce message
et donc ça n'a pas l'air trop mal et bien sûr essayons aussi de désactiver ce filtre à
nouveau et revenons, voici les spaghettis . Donc, cela fonctionne maintenant et c'est ainsi que nous pouvons gérer notre état avec Redux.