1
00:00:02,170 --> 00:00:10,150
Comment pouvons-nous résoudre ce problème dont nous avons besoin ici pour trouver un repas spécifique et nous ne pouvons pas vraiment utiliser

2
00:00:10,600 --> 00:00:13,600
notre sélecteur ici dans les options de navigation?

3
00:00:13,600 --> 00:00:19,960
Maintenant, il y a deux correctifs possibles - le correctif numéro un est que nous utilisons à nouveau les bons anciens paramètres

4
00:00:19,990 --> 00:00:22,190
pour communiquer entre les options de composant

5
00:00:22,210 --> 00:00:29,470
et de navigation comme je l'ai montré dans le module de navigation. Ici, dans le composant, nous chargeons notre repas, donc bien sûr ici

6
00:00:29,470 --> 00:00:37,310
nous pouvons utiliser les paramètres de navigation des accessoires et maintenant définir les paramètres à une nouvelle valeur ici et maintenant nous pouvons utiliser définir les paramètres pour

7
00:00:37,310 --> 00:00:43,300
transférer le repas sélectionné ou son titre dans l'en-tête et tout ce que vous définissez ici est des paramètres en passant sera

8
00:00:43,300 --> 00:00:48,340
fusionné avec les paramètres existants, donc cela ne les remplacera pas, donc vous ne remplacerez pas votre repasId

9
00:00:48,340 --> 00:00:52,630
que vous récupérez ici, qui sera toujours là, vous êtes juste en ajoutant quelque chose

10
00:00:52,870 --> 00:00:56,840
de nouveau, vous ne remplacez un paramètre que s'il existe déjà dans les paramètres.

11
00:00:56,920 --> 00:01:04,030
Donc, ici, nous pourrions ajouter la clé de titre du repas et la définir sur le repas sélectionné. Titre.

12
00:01:04,050 --> 00:01:13,120
Maintenant, cela signifie que j'ai envoyé ces paramètres à mon en-tête lorsque ce composant est rendu à la fin.

13
00:01:15,800 --> 00:01:20,270
Maintenant, comme cela changera les accessoires, nous nous retrouverions généralement dans une boucle infinie,

14
00:01:20,270 --> 00:01:24,710
donc pour rompre cela, nous utiliserons l'effet d'utilisation ici comme je l'ai

15
00:01:24,800 --> 00:01:29,780
montré dans le module de navigation et le faisons en fait à l'intérieur de l'effet d'utilisation.

16
00:01:29,780 --> 00:01:32,690
Donc, ici, nous pouvons utiliser use use et comme dépendance,

17
00:01:35,230 --> 00:01:41,430
je vais spécifier un tableau vide pour l'instant, puis définir des paramètres ici à l'intérieur de la fonction use effect et

18
00:01:41,440 --> 00:01:42,320
je n'aurai

19
00:01:42,520 --> 00:01:47,290
pas de tableau vide ici, au lieu de cela ma dépendance ici est ma sélection repas.

20
00:01:47,290 --> 00:01:55,150
Lorsque cela change, je souhaite transmettre les nouvelles informations à l'en-tête. Maintenant, nous verrons si cela fonctionne, allons à l'en-tête et là,

21
00:01:55,150 --> 00:01:56,250
nous pouvons

22
00:01:56,350 --> 00:01:59,050
maintenant récupérer cela à partir des paramètres.

23
00:01:59,050 --> 00:02:01,720
Alors là, j'ai mon titre de repas,

24
00:02:02,080 --> 00:02:09,240
je peux l'obtenir avec navigationData. la navigation. Titre du repas getParam, c'est le

25
00:02:09,240 --> 00:02:12,660
nom que j'ai choisi lors de la configuration des paramètres ici.

26
00:02:19,700 --> 00:02:21,590
Maintenant, avec le titre du

27
00:02:21,590 --> 00:02:28,190
repas sélectionné ici, nous pouvons définir le titre de l'en-tête sur ce titre du repas et commenter cette ligne car cela ne

28
00:02:28,200 --> 00:02:30,140
fonctionnera pas de toute façon et essayons.

29
00:02:30,140 --> 00:02:35,660
Enregistrons cela et allons à la page de détail et pendant que cela

30
00:02:35,660 --> 00:02:40,410
fonctionne, vous verrez un problème. Lorsque cela se charge, initialement il n'y a pas de titre

31
00:02:40,430 --> 00:02:42,140
et cela n'apparaît qu'après un certain temps.

32
00:02:42,140 --> 00:02:47,350
Donc, seulement après que cela soit complètement chargé, nous voyons cette pop de titre qui

33
00:02:47,360 --> 00:02:49,530
n'est pas trop belle et la

34
00:02:49,790 --> 00:02:55,340
raison en est simplement que notre logique fonctionne ici, mais puisque l'effet d'utilisation s'exécute après le rendu du

35
00:02:55,340 --> 00:03:00,770
composant pour la première fois, nous attendons pour que le composant soit rendu pour la première fois

36
00:03:00,770 --> 00:03:06,980
jusqu'à ce que nous envoyions les paramètres au titre et cela signifie que lorsque cette transition est toujours en cours

37
00:03:06,980 --> 00:03:12,400
de lecture et que le rendu n'est pas complètement terminé, nous ne montrons pas vraiment ce titre.

38
00:03:12,680 --> 00:03:15,630
C'est pourquoi ce n'est peut-être pas la solution

39
00:03:15,650 --> 00:03:20,960
optimale ici et je commenterai cela. Une meilleure solution ici, aussi bon marché que cela

40
00:03:21,060 --> 00:03:26,310
puisse paraître, mais c'est aussi une solution que vous pouvez souvent utiliser, c'est que vous transférez simplement le titre dont

41
00:03:26,310 --> 00:03:31,800
nous aurons besoin ici depuis l'intérieur du composant dont vous venez, afin de le charger lorsque vous êtes dans le composant

42
00:03:31,800 --> 00:03:36,510
qui ira à ce composant et que vous l'envoyez à ce composant avant qu'il ne soit chargé.

43
00:03:36,510 --> 00:03:42,090
Envoyons donc les données à l'avance et nous venons de l'écran des

44
00:03:42,090 --> 00:03:49,880
favoris ou de l'écran des catégories de repas. Là, nous finissons par taper un élément dans la liste des repas et dans les deux éléments,

45
00:03:49,890 --> 00:03:54,240
dans les deux composants, l'écran préféré et l'écran de la catégorie de repas, nous utilisons la liste des repas,

46
00:03:54,240 --> 00:04:00,420
ce qui est bien parce que cela signifie que nous pouvons aller à la liste des repas ici et là, nous avons cette action de navigation et maintenant

47
00:04:00,420 --> 00:04:06,330
simplement en plus de passer l'ID du repas, il serait bon que nous passions déjà ici le titre du repas car ici nous l'avons disponible, non?

48
00:04:06,540 --> 00:04:13,350
itemData. article. titre, c'est notre titre du repas. En le fournissant simplement ici, nous

49
00:04:13,350 --> 00:04:17,950
résolvons tous les problèmes que nous avons sur l'autre écran, c'est donc certainement l'approche que nous voulons utiliser ici.

50
00:04:18,090 --> 00:04:24,060
Donc, en définissant ce paramètre ici sur le composant où nous déclenchons cette action de navigation vers la page de détail du repas,

51
00:04:24,060 --> 00:04:30,270
nous avons résolu ce problème car maintenant vous voyez que le titre est là dès le début et nous n'avons aucun problème là-bas et

52
00:04:30,270 --> 00:04:36,180
le même bien sûr également sur Android si nous essayons là-bas. Mon émulateur est juste un peu

53
00:04:36,180 --> 00:04:43,380
lent, mais vous pouvez généralement le voir également. C'est ainsi que nous pouvons travailler avec des données dans

54
00:04:43,380 --> 00:04:50,850
l'en-tête lorsque nous en avons besoin de Redux et avec cela, nous avons un premier état solide, nous pouvons

55
00:04:50,850 --> 00:04:54,830
utiliser nos données Redux. Ce que nous ne sommes pas vraiment en mesure de

56
00:04:54,900 --> 00:04:59,790
faire, c'est de le changer, c'est donc la prochaine étape, nous voulons ajouter un peu de logique afin que nous puissions changer les données, que nous

57
00:04:59,880 --> 00:05:01,890
pouvons marquer les favoris et que nous pouvons filtrer nos données.