1
00:00:02,710 --> 00:00:05,590
Sekarang Anda tahu bagaimana kita bisa pergi ke halaman detail tentu saja, itu adalah

2
00:00:05,620 --> 00:00:11,530
sesuatu yang kami lakukan sebelumnya ketika kami pergi dari halaman kategori ke halaman makanan kategori. Jadi kita dapat menggunakan pendekatan yang sama di

3
00:00:11,530 --> 00:00:12,880
sini dan tentu

4
00:00:12,910 --> 00:00:16,900
saja merasa bebas untuk menghentikan video pada saat ini dan melakukannya sendiri,

5
00:00:16,900 --> 00:00:24,540
itu benar-benar sesuatu yang dapat Anda lakukan di sini sebagai latihan. Mari kita tentu saja juga melakukannya bersama.

6
00:00:24,630 --> 00:00:32,550
Jadi pada layar kategori makanan, ketika kita memilih makanan, di

7
00:00:32,550 --> 00:00:39,950
Seleksi di sini, sehingga harus diaktifkan pada makanan tertentu dan

8
00:00:39,950 --> 00:00:42,550
karena itu

9
00:00:42,570 --> 00:00:48,870
di layar kategori makanan, dalam fungsi ini di

10
00:00:48,870 --> 00:00:54,870
sini, kita dapat menavigasi. Sekarang karena saya mendefinisikan fungsi render meal ini di

11
00:00:54,900 --> 00:01:00,780
mana saya render item makan saya di dalam komponen saya, saya memiliki akses ke alat peraga dan di sana, karena

12
00:01:00,780 --> 00:01:07,050
layar makanan kategori adalah komponen yang kami muat dengan bantuan navigasi, saya dapat mengakses properti navigasi dan metode navigasi dan Anda mengetahui

13
00:01:07,050 --> 00:01:12,820
bahwa di sana, kami sekarang dapat melewati nama rute di mana kami ingin pergi dan itu akan menjadi detail

14
00:01:12,900 --> 00:01:18,810
makanan, sehingga nama rute yang kami atur di navigator makanan, nama ini di sini, ini akan memuat halaman detail makanan.

15
00:01:19,590 --> 00:01:26,400
Sekarang kita perlu meneruskan beberapa data di sana dan data yang ingin saya teruskan di sini tentu saja adalah

16
00:01:26,400 --> 00:01:32,850
ID dari makanan yang dipilih, sehingga kita dapat memuat rincian makanan itu pada halaman detail makanan untuk

17
00:01:32,850 --> 00:01:34,500
membuat mereka di sana.

18
00:01:34,770 --> 00:01:44,520
Jadi pada layar kategori makanan di sini, kita dapat mengatur params di sini pada objek navigasi kita, pada objek yang kita lewati untuk menavigasi dan params

19
00:01:44,520 --> 00:01:49,980
mengambil objek pasangan nilai-kunci saat Anda pelajari, itu adalah sesuatu yang kami lakukan sebelum dan

20
00:01:49,980 --> 00:01:56,730
di sini, saya ingin untuk meneruskan makan saya. id yang tentu saja bisa saya dapatkan

21
00:01:56,790 --> 00:02:03,330
dari data item karena itemData. item adalah makanan dan setiap makanan seperti yang Anda lihat dalam model memiliki ID, kami menyimpannya di sini.

22
00:02:04,320 --> 00:02:10,890
Karenanya di sini tentu saja kita bisa mengatakan itemData. barang. id, itu yang ingin saya teruskan dan

23
00:02:10,890 --> 00:02:16,650
dengan itu, kita harus pergi ke halaman detail makanan dan di sana, kita juga akan dapat mengekstraksi ID makanan yang

24
00:02:16,650 --> 00:02:17,410
kita muat.

25
00:02:17,640 --> 00:02:26,760
Jadi pada MealDetailScreen, mari kita lihat apakah itu berhasil, makan. id adalah alat peraga. navigasi. getParam dan

26
00:02:26,760 --> 00:02:34,470
sekarang namanya adalah makanan. id, itu nama param yang saya pilih di sini untuk menyimpan

27
00:02:34,470 --> 00:02:39,090
param, jika Anda memilih nama yang berbeda di sini, Anda harus memilih nama

28
00:02:39,090 --> 00:02:46,980
yang berbeda di sini atau menggunakan nama yang sama di sana tentu saja dan sekarang kita dapat memilih makanan, untuk itu mari kita

29
00:02:46,980 --> 00:02:59,800
impor semua makanan dari file data dummy di folder data, seperti ini dan sekarang makanan yang dipilih di sini tentu saja adalah makanan yang ditemukan dan kemudian kita menjalankan fungsi ini pada setiap makanan di sana dan

30
00:02:59,800 --> 00:03:05,770
itu adalah makanan tempat makan. id cocok dengan makanan. id kita ekstrak

31
00:03:05,860 --> 00:03:14,200
di sana, itu makanan pilihan kami. Untuk membuktikan bahwa ini berfungsi, kita dapat menampilkannya di sana, terpilihMeal. judul dan tentu saja saya

32
00:03:14,290 --> 00:03:21,250
juga ingin mengatur judul di header dan itu juga sesuatu yang Anda pelajari.

33
00:03:21,970 --> 00:03:28,460
Anda dapat melakukan ini dengan menambahkan opsi navigasi ke layar ini di sini, opsi navigasi dan Anda

34
00:03:28,490 --> 00:03:35,090
mengetahui bahwa jika Anda ingin mengambil sesuatu yang dinamis, Anda melakukan ini dengan bantuan fungsi khusus ini di sini.

35
00:03:35,690 --> 00:03:42,650
Data navigasi adalah apa yang Anda dapatkan di sana, fungsi ini dipanggil untuk Anda dengan React navigation seperti yang Anda

36
00:03:43,340 --> 00:03:52,050
pelajari dan sekarang di sana, kami harus mengembalikan objek navigasi kami, objek opsi navigasi kami tetapi sebelum kami mengembalikan ini, kami dapat menggunakan data yang

37
00:03:52,050 --> 00:03:58,470
kami dapatkan dari data navigasi, seperti prop navigasi kami yang pada gilirannya memungkinkan kami untuk mendapatkan akses

38
00:03:58,470 --> 00:04:09,340
ke param, sehingga kami dapat menggunakan navigationData. navigasi. getParam untuk mendapatkan makanan kami. id di sini juga dan juga mengambil

39
00:04:09,340 --> 00:04:13,890
makanan kami seperti yang kami lakukan di sana dalam komponen, melakukan hal

40
00:04:13,990 --> 00:04:19,630
yang sama di sana untuk opsi navigasi dan dengan makanan yang dipilih, kita tentu saja

41
00:04:19,630 --> 00:04:25,040
dapat mengatur judul header untuk selectedMeal. judul dan itu adalah sesuatu yang kami lakukan sebelumnya,

42
00:04:25,060 --> 00:04:30,650
ini adalah bagaimana kami dapat mengekstraksi data di sini di opsi navigasi kami dan menggunakan data dinamis di sana

43
00:04:30,790 --> 00:04:32,620
misalnya untuk mengatur judul header.

44
00:04:35,400 --> 00:04:37,830
Dengan ini, mari

45
00:04:37,920 --> 00:04:47,600
kita lihat apakah itu berfungsi, mungkin di Android. Mari kita beralih ke cahaya dan indah, di sana kita memiliki semua resep kita, mari kita

46
00:04:49,530 --> 00:04:54,690
pergi ke salad di sini dan ini dia, ini judul kami, kami juga melihatnya di sini jadi ini

47
00:04:54,690 --> 00:04:58,050
semua dimuat, jika kita pergi ke salmon, kita malah melihat bahwa.

48
00:04:58,050 --> 00:05:00,850
Jadi ini semua berfungsi sebagaimana mestinya, sangat menyenangkan

49
00:05:00,870 --> 00:05:02,350
untuk dilihat, sekarang

50
00:05:02,370 --> 00:05:08,340
saatnya untuk mengambil langkah berikutnya karena misalnya, kami ingin dapat menandai makanan sebagai favorit dan untuk

51
00:05:08,340 --> 00:05:13,650
ini, saya ingin memiliki ikon bintang di sini di navigasi yang bisa saya tekan.

52
00:05:13,650 --> 00:05:16,290
Itu adalah sesuatu yang belum kita temukan dan belum kita pelajari,

53
00:05:16,320 --> 00:05:17,850
jadi ini langkah bagus selanjutnya.