1 00:00:02,300 --> 00:00:07,750 Sekarang tergantung pada versi React redux yang Anda gunakan jika Anda menggunakan versi 7 atau lebih tinggi. 2 00:00:07,940 --> 00:00:15,970 Anda juga dapat menggunakan alternatif metode atau fungsi Connect yang selalu kami gunakan untuk menghubungkan komponen 3 00:00:15,980 --> 00:00:17,850 kami ke redux. 4 00:00:17,850 --> 00:00:21,050 Jadi sekarang saya selalu menghubungkan fungsi urutan yang lebih tinggi. 5 00:00:21,060 --> 00:00:23,120 Ngomong-ngomong, tidak ada yang salah dengan menggunakannya. 6 00:00:23,120 --> 00:00:29,210 Anda benar-benar dapat menggunakannya dengan komponen fungsional juga tetapi Anda juga bisa beralih dari ini dan ada kait tertentu yang sekarang ditawarkan 7 00:00:29,630 --> 00:00:37,710 oleh itu bereaksi redux sehingga dalam burger broiler J. S. jatuh dari reaksi redux Anda 8 00:00:37,710 --> 00:00:44,100 juga dapat mengimpor pengiriman bekas dan menggunakan pemilih dan ini adalah dua 9 00:00:44,100 --> 00:00:51,000 kait penting untuk memungkinkan Anda mendapatkan data dari toko redux Anda dan tindakan pengiriman. 10 00:00:51,000 --> 00:00:57,490 Jadi mari kita pergi ke bagian bawah burger Boulder J. S. kontainer sekarang dan di sana Anda melihat 11 00:00:57,540 --> 00:01:01,410 Mac menjadi lima tindakan untuk mengirim sesuatu sekarang dengan Anda sebagai tambalan ini. 12 00:01:01,410 --> 00:01:03,830 Kita cukup ambil kode itu di sini. 13 00:01:04,020 --> 00:01:08,580 Salin dan kemudian pergi ke suatu tempat ke bagian atas komponen ini. 14 00:01:08,580 --> 00:01:16,320 Katakanlah di sini setelah kita menginisialisasi keadaan dan kita dapat memanggil pengiriman gunakan dan apa 15 00:01:16,320 --> 00:01:20,570 ini memberi kita pada akhirnya hanyalah fungsi pengiriman. 16 00:01:20,580 --> 00:01:25,290 Sekarang saya bisa menempel di kode yang baru disalin di mana saya mendefinisikan bahan yang ditambahkan dan sebagainya. 17 00:01:26,920 --> 00:01:33,510 Dan mendefinisikan pada bahan yang ditambahkan sebagai konstanta yang pada akhirnya memiliki fungsi di mana saya mendapatkan nama bahan dan kemudian 18 00:01:33,510 --> 00:01:38,340 saya memanggil tambalan ini sekarang merujuk ke fungsi pengiriman yang menggunakan tambalan ini memberi kita 19 00:01:38,340 --> 00:01:44,130 yang tentu saja adalah fungsi yang mengirim tindakan untuk toko redux dan kita bisa melakukan hal yang sama 20 00:01:44,190 --> 00:01:47,030 untuk semua fungsi yang kita miliki di sini. 21 00:01:47,040 --> 00:01:52,290 Jadi keempatnya pada marah dan dihapus mengubah kita menjadi sebuah konstanta yang pada akhirnya memiliki 22 00:01:52,290 --> 00:01:53,280 fungsi anonim. 23 00:01:53,280 --> 00:02:02,130 Sama di sini untuk bahan init dan pastikan Anda menyingkirkan koma ini di akhir baris dan gunakan 24 00:02:02,190 --> 00:02:04,550 titik koma sebagai gantinya. 25 00:02:04,680 --> 00:02:07,580 Dan kemudian sama di sini untuk di dalamnya per Chase. 26 00:02:07,580 --> 00:02:13,510 Ini adalah konstanta sekarang yang menyimpan fungsi dan keempatnya di set off jalur redirect. 27 00:02:13,560 --> 00:02:17,560 Ini adalah fungsi atau konstanta yang memegang fungsi. 28 00:02:17,580 --> 00:02:22,410 Sekarang kita tentu saja tidak lagi harus mengekstrak bahan init dari alat peraga karena sekarang ini bukan lagi 29 00:02:22,410 --> 00:02:28,560 bagian dari alat peraga karena kita akan segera tidak lagi menggunakan penghubung untuk menambahkan ini ke penyangga sehingga kita dapat menghapus di sini kita 30 00:02:28,830 --> 00:02:30,180 memilikinya sebagai fungsi di sini. 31 00:02:30,180 --> 00:02:37,980 Sekarang dan kemudian semua tempat lain di mana saya meminta alat peraga dengan rakus pada bahan yang ditambahkan berakhir di semua 32 00:02:37,980 --> 00:02:41,060 tempat ini sekarang kita bisa menyingkirkan alat peraga. 33 00:02:41,250 --> 00:02:47,730 Jadi ya alat peraga pada bahan yang ditambahkan. Sekarang hanya pada bahan yang ditambahkan alat 34 00:02:47,940 --> 00:02:54,360 peraga pada bahan yang dihilangkan hanya pada bahan yang dihilangkan karena kita mendefinisikan fungsi-fungsi 35 00:02:54,360 --> 00:03:00,660 ini sekarang semuanya ada di sana dengan bantuan fungsi pengiriman ini. dari bereaksi 36 00:03:00,660 --> 00:03:07,740 redux jadi semua tentu saja untuk di dalamnya per pengejaran di mana saya menggunakannya di sana. 37 00:03:07,760 --> 00:03:13,940 Mari kita hapus hal-hal alat peraga dan juga bertahan pada pengalihan jalur pengalihan. 38 00:03:13,960 --> 00:03:21,650 Mari kita hapus alat peraga sehingga Anda memastikan bahwa Anda selalu hanya memanggil fungsi-fungsi 39 00:03:21,650 --> 00:03:28,280 ini sekarang tanpa alat peraga di depan itu yang sangat penting ya. 40 00:03:28,340 --> 00:03:29,270 Kelihatan bagus. 41 00:03:31,130 --> 00:03:37,850 Sekarang sama untuk memilih nilai peta keadaan untuk alat peraga di sini mengembalikan sebuah objek di mana 42 00:03:37,850 --> 00:03:46,160 kita mendapatkan harga bahan Arends pada kita dapat menggunakan fungsi pemilih menggunakan untuk menggunakan kait pemilih di sini lagi dengan pergi 43 00:03:46,160 --> 00:03:54,710 ke atas burger Boulder katakanlah di sini dan memanggil use selector dan use selector sekarang mengambil fungsi sebagai argumen yang akan memberi 44 00:03:54,770 --> 00:04:00,620 Anda keadaan saat ini karena fungsi ini akan dieksekusi oleh react redux dan itu 45 00:04:00,620 --> 00:04:09,410 akan memberi Anda snapshot keadaan saat ini dan kemudian Anda mengembalikan nilai di sini sehingga Anda berada dalam fungsi tubuh Anda mengembalikan 46 00:04:09,410 --> 00:04:16,790 nilai nilai yang Anda kembalikan di sini pada akhirnya akan menjadi hasil dari penggunaan pilih recall Anda jadi di 47 00:04:16,790 --> 00:04:26,570 sini dalam komponen ini kita bisa mengatakan kami tertarik pada beberapa negara burger broiler dan kemudian juga pada keadaan off kami di ini salin semua 48 00:04:26,570 --> 00:04:32,480 yang diautentikasi semua itu sehingga mereka memilikinya untuk referensi dan menambahkannya di sini hanya 49 00:04:32,480 --> 00:04:34,580 agar saya bisa melihatnya 50 00:04:37,220 --> 00:04:43,520 sementara kami mengerjakan ini Anda pilih ingat sekarang mari kita lihat bagaimana kita dapat mengekstrak kita 51 00:04:43,520 --> 00:04:50,270 dengan cara yang elegan misalnya kita bisa mengelola untuk nilai-nilai yang berbeda di sini kita bisa melihat 52 00:04:50,270 --> 00:04:56,420 Angie bahan kita dengan memanggil pemilih penggunaan dan di sana kita mendapatkan negara kita dan 53 00:04:56,420 --> 00:05:04,680 sekarang di sini kita ingin kembali pembangun DOT Burger negara jadi pada dasarnya apa yang saya lakukan di sana dot bahan. 54 00:05:04,810 --> 00:05:09,850 Jadi pada dasarnya apa yang saya gali di sini bedanya sekarang 55 00:05:09,850 --> 00:05:18,160 keadilan saya akan melakukan ini empat kali sehingga saya hanya memiliki empat konstanta berbeda di mana saya mengatur keadaan itu 56 00:05:19,490 --> 00:05:28,030 sehingga semua tunduk pada pemanggilan harga menggunakan pemilih di sana kita akan mendapatkan status dan saya ingin kembali negara Berger 57 00:05:28,280 --> 00:05:35,810 pembangun dot total harga jadi pada dasarnya apa pun yang dikembalikan atau mengekstraknya di sana kemudian juga kesalahan 58 00:05:35,810 --> 00:05:49,640 di sini di mana saya sebut pemilih penggunaan mendapatkan status saya dan kami mengembalikan negara Berger atau kesalahan bowler dan untuk adalah otentikasi itu disahkan saya akan gunakan gunakan pemilih negara dan kembalikan 59 00:05:51,440 --> 00:05:58,430 diri saya menyatakan dot off token titik tepatnya saya kembali atau garam apakah itu kecil atau 60 00:05:58,430 --> 00:06:06,250 tidak dengan itu saya bisa menyingkirkan ini di sini dan sekarang Anda mungkin bertanya-tanya mengapa kita melakukan ini. 61 00:06:06,250 --> 00:06:08,740 Yah sekarang lebih dekat ke logika. 62 00:06:08,740 --> 00:06:14,680 Kita juga bisa menggunakan dengan bantuan U. S. menyatakan di mana kami juga mengelola berbagai 63 00:06:14,830 --> 00:06:20,320 negara dan keprihatinan yang berbeda, alih-alih memiliki satu objek besar di mana semua negara bagian kami melakukan hal yang sama di 64 00:06:20,320 --> 00:06:25,390 sini atau mengekstraksi keempat informasi yang kami butuhkan dalam komponen ini dari kondisi redux kami dengan pemilih penggunaan. 65 00:06:25,390 --> 00:06:31,030 Dan tentu saja kita bisa juga bekerja dengan satu konstanta dan mengekstrak hanya pembangun Berger 66 00:06:31,030 --> 00:06:36,490 di sini yang merupakan objek dengan banyak status di sana, tetapi mengelola ini karena 67 00:06:36,490 --> 00:06:45,830 untuk masing-masing negara agak lebih bersih menurut saya dan mereka menawarkan sekarang di semua tempat di mana kita alat peraga bekas yang disimpan, kami sekarang 68 00:06:45,920 --> 00:06:55,170 hanya menggunakan bel, karena sekarang ini adalah konstanta yang berdiri sendiri, hal ini sangat Anda lakukan, meskipun di sini di mana kami telah menyimpan 69 00:06:55,170 --> 00:07:03,680 gambar yang tepat hanya saya kira karena ini adalah konstanta kami baru saja membuat dinding di sini sehingga Anda dapat cukup cari seluruh 70 00:07:03,680 --> 00:07:09,710 file untuk semua kemunculan alat peraga pemikiran dan hapus benda peraga di sini yang saya lihat 71 00:07:09,710 --> 00:07:14,240 kita semua bisa menyingkirkan harga saham prop karena kita semua mengurangi 72 00:07:14,390 --> 00:07:16,630 harga sebagai konstanta mandiri sekarang. 73 00:07:16,670 --> 00:07:24,890 Yang sama adalah yang diautentikasi jadi saya akan segera memperbaikinya dan itu terlihat bagus sekarang untuk harga biar cepat mencari ini jika kita 74 00:07:24,910 --> 00:07:28,900 memiliki harga saham prop di mana saja nggak terlihat bagus 75 00:07:31,750 --> 00:07:37,080 sekarang untuk kesalahan di sana kita punya kesalahan yang prop jadi saya ingin untuk menghilangkan 76 00:07:40,290 --> 00:07:47,670 itu dan sekarang ini terlihat baik-baik saja dan 4 adalah otentikasi di sini kita memiliki alat peraga dikonfirmasi mari kita menyingkirkan 77 00:07:47,670 --> 00:07:55,220 bahwa itu tidak selalu terlihat baik dengan semua itu kita bisa menyingkirkan dua konstanta ini di keadaan peta bawah dua alat 78 00:07:55,220 --> 00:08:01,280 peraga dan petakan tambalan ini untuk alat peraga dan singkirkan seluruh fungsi koneksi di sini dan sekali 79 00:08:01,280 --> 00:08:07,160 lagi ini adalah opsional Anda benar-benar dapat terus menggunakan menghubungkan menggunakan kait baru ini adalah opsional 80 00:08:07,160 --> 00:08:12,290 Saya hanya ingin Anda menunjukkannya kepada Anda sehingga Anda tahu bahwa ini adalah 81 00:08:12,290 --> 00:08:19,560 alternatif dan sekarang kita akan memiliki masalah meskipun jika kita sekarang aman dan kita pergi ke tab Jaringan di halaman 82 00:08:19,560 --> 00:08:25,770 kita Anda akan melihat bahwa permintaan kami sedang naik kami mengirim permintaan setelah permintaan sekarang untuk menghentikan 83 00:08:25,770 --> 00:08:31,770 itu terjadi mari kita komentar cepat di dalam ert Bahan keselamatan sehingga membangun kembali dan mari 84 00:08:31,770 --> 00:08:39,150 sekarang mencari tahu mengapa disinfektan dipecat sepanjang waktu dipecat sepanjang waktu karena baik itu menyala setiap kali di dalamnya bahan berubah. 85 00:08:39,150 --> 00:08:44,280 Ini sekarang adalah konstanta yang kita buat di sini yang menyimpan fungsi dan lagi-lagi fungsi hanyalah 86 00:08:44,280 --> 00:08:45,440 objek dalam javascript. 87 00:08:45,780 --> 00:08:52,680 Sekarang konstanta ini akan dibuat ulang setiap kali seluruh komponen yang dicetak tebal Burger ini dieksekusi kembali setiap 88 00:08:52,680 --> 00:08:56,290 kali fungsi komponen fungsional dijalankan kembali dengan benar. 89 00:08:56,400 --> 00:09:02,520 Jadi untuk setiap rendering burger builder yang kami buat di dalamnya bahan-bahan kami benar-benar menciptakan kembali 90 00:09:02,520 --> 00:09:09,150 semua fungsi ini sekarang yang berarti mati di dalamnya bahan akan berubah setiap kali komponen ini dibangun kembali 91 00:09:09,150 --> 00:09:14,400 dan oleh karena itu efek ini akan secara efektif berjalan setiap kali komponen 92 00:09:14,910 --> 00:09:21,330 ini rekondisi tentu saja bukan yang saya inginkan sekarang kita mengandalkan tambalan ini di sini meskipun yang 93 00:09:21,390 --> 00:09:27,810 kita dapatkan dari menggunakan tambalan ini yang kita karena aturan kait hanya dapat memanggil bagian dalam komponen 94 00:09:27,810 --> 00:09:34,320 ini kita tidak bisa melakukan outsourcing fungsi ini lakukan di dalamnya bahan berfungsi menjadi tempat di luar komponen 95 00:09:34,320 --> 00:09:42,120 ini, tetapi sebagai gantinya kita dapat menggunakan kait lain yang diperkenalkan oleh panggilan balik penggunaan panggilan balik yang akan Anda pelajari tentang 96 00:09:42,120 --> 00:09:49,240 hal ini dalam modul kait reaksi yang dapat dililitkan di sekitar fungsi menjadi putih sehingga dapat dibuat ulang semuanya. waktu. 97 00:09:49,260 --> 00:09:57,420 Jadi di sini kita cukup meletakkan fungsi ini di mana kita mengirim bahan ke dalamnya menggunakan callback dan sekarang menggunakan callback 98 00:09:57,420 --> 00:10:02,520 mengambil argumen kedua argumen pertama adalah fungsi membungkus argumen kedua adalah daftar 99 00:10:02,520 --> 00:10:07,730 dependensi dari fungsi ini yang memberitahu bereaksi ketika harus benar-benar membangun kembali ini fungsi. 100 00:10:07,860 --> 00:10:13,530 Dan di sini kita tidak memiliki ketergantungan eksternal nyata karena pengiriman sudah dikonfigurasi untuk 101 00:10:13,530 --> 00:10:17,250 tidak membangun kembali pada setiap rekreasi fungsi itu. 102 00:10:17,250 --> 00:10:18,270 Jadi kita tidak perlu menambahkannya. 103 00:10:18,300 --> 00:10:24,780 Kita dapat menambahkannya tetapi itu harus dikelola dengan bereaksi redux sedemikian sehingga tidak tidak selalu 104 00:10:24,780 --> 00:10:25,740 dibuat ulang. 105 00:10:25,740 --> 00:10:31,330 Jadi sekarang dengan mati kami memastikan bahwa pada init bahan benar-benar akan men-cache nilai. 106 00:10:31,330 --> 00:10:37,230 Fungsi ini di sini dan tidak membuat ulang objek fungsional ini untuk setiap rekreasi atau setiap 107 00:10:37,230 --> 00:10:38,600 rendering komponen ini. 108 00:10:38,700 --> 00:10:45,660 Jadi jika kita melakukan itu dan kita komentari ini kembali dan kita menyimpan ini sekarang kita benar-benar melihat kita tidak 109 00:10:45,810 --> 00:10:52,080 lagi memiliki jumlah permintaan yang tak terbatas karena penggunaan callback Q dan sekali lagi pastikan Anda melalui modul 110 00:10:52,080 --> 00:10:58,770 hook yang bereaksi modul modul sebelum yang ini karena di sana saya juga menjelaskan panggilan balik ini secara lebih mendalam 111 00:10:58,770 --> 00:11:04,740 dan juga bagaimana kita dapat menggunakannya untuk mengoptimalkan kinerja atau siklus render putih yang tidak perlu. 112 00:11:04,740 --> 00:11:11,340 Di sini sangat penting untuk loop yang luas dan tidak terbatas dan dengan yang kita gunakan gunakan pemilih dan 113 00:11:11,830 --> 00:11:16,710 gunakan pengiriman alih-alih untuk menghubungkan komponen urutan yang lebih tinggi menggunakannya adalah opsional. 114 00:11:16,710 --> 00:11:22,020 Anda tidak harus menggunakannya dan saya tidak akan mengganti koneksi di semua tempat di aplikasi ini dengan menggunakan pengiriman dan 115 00:11:22,020 --> 00:11:27,210 gunakan pemilih tetapi tentu saja saya ingin menunjukkannya kepada Anda sehingga Anda mengetahui opsi ini jika Anda ingin gunakan 116 00:11:27,210 --> 00:11:31,440 kait di mana-mana dan Anda tidak ingin menggunakan untuk menghubungkan komponen tingkat tinggi lagi.