Dasar useReducer & Pola Aksi
Pelajari useReducer: state + reducer(state, action) → state berikutnya. Gunakan aksi yang jelas (type, payload) untuk menangani pembaruan banyak bidang.
Dasar useReducer & Pola Aksi adalah pelajaran React Academy gratis di CoddyKit. Ini adalah pelajaran 2 dari 3. Kamu bisa membaca pelajaran lengkapnya di bawah secara gratis — lalu praktikkan langsung di browser dengan editor kode bawaan dan tutor AI 24/7. Ini adalah bagian dari jalur belajar React Academy, dan progresmu tersinkronisasi di web dan aplikasi CoddyKit. Kursus React Academy mencakup 3 pelajaran total.
Mengapa menggunakan useReducer?
Tujuan: Gunakan useReducer untuk mengelola pembaruan dengan satu fungsi pereduksi. Ini berguna ketika beberapa bidang berubah bersama.
- Objek status
- Tindakan: jenis + data
- Pereduksi murni(status, tindakan)
Struktur pereduksi
Pereduksi menerima status saat ini dan sebuah tindakan, lalu mengembalikan status berikutnya. Jaga agar tetap murni (tanpa efek samping). Gunakan jenis tindakan kecil seperti INCREMENT, RESET, atau UPDATE_FIELD.
Demonstrasi: penghitung dengan useReducer
Penghitung kecil menunjukkan alur status → tindakan → status berikutnya menggunakan useReducer.
<div id="root"></div>
Pola tindakan
Jaga agar tindakan tetap sederhana:
- type: kata kerja singkat (misalnya, UPDATE_FIELD)
- payload: data yang diperlukan
- Opsional, gunakan pembuat tindakan kecil untuk menghindari kesalahan pengetikan
Demonstrasi: formulir dengan pereduksi
Pereduksi formulir menangani beberapa bidang dengan satu tindakan UPDATE_FIELD. Satu tempat mengendalikan semua pembaruan.
<div id="root"></div>
Kiat & jebakan
Kiat:
- Jaga agar pereduksi tetap murni dan kecil.
- Kelompokkan bidang yang berkaitan ke dalam satu objek status.
- Gunakan nama tindakan yang jelas; hindari banyak cabang yang serupa.
Pemeriksaan pilihan useReducer
Ringkasan
Ringkasan: Definisikan pereduksi murni, kirim tindakan sederhana, dan kelola pembaruan beberapa bidang di satu tempat. Pilih useReducer ketika beberapa nilai berubah bersama.
Pertanyaan yang Sering Diajukan
Apakah pelajaran “Dasar useReducer & Pola Aksi” gratis?
Ya — teks lengkap “Dasar useReducer & Pola Aksi” gratis dibaca di sini di web. Untuk praktiknya secara interaktif (editor kode bawaan dan tutor AI 24/7) dan buka sisa kursus React Academy, upgrade ke CoddyKit PRO. Kursus React Academy mencakup 3 pelajaran total.
Apa yang akan aku pelajari di “Dasar useReducer & Pola Aksi”?
Pelajari useReducer: state + reducer(state, action) → state berikutnya. Gunakan aksi yang jelas (type, payload) untuk menangani pembaruan banyak bidang. Kamu berlatih React Academy dengan kode praktik yang langsung kamu jalankan di browser, dan tutor AI 24/7 menjawab pertanyaanmu saat kamu mengerjakan pelajaran ini.
Apakah aku perlu pengalaman untuk memulai React Academy?
Tidak diperlukan pengalaman sebelumnya. React Academy di CoddyKit dirancang untuk pemula hingga pelajar tingkat lanjut, jadi kamu bisa memulai di sini atau dari awal dan belajar sesuai kecepatan kamu sendiri. Ini adalah pelajaran 2 dari 3.
Berapa lama pelajaran “Dasar useReducer & Pola Aksi” memakan waktu?
Sebagian besar pelajaran CoddyKit memakan waktu sekitar 5–10 menit. Setiap pelajaran ringkas dan interaktif, jadi kamu membuat kemajuan stabil dan melanjutkan dari tempat kamu tinggalkan di web dan aplikasi.
Bisakah aku menulis dan menjalankan kode dalam pelajaran React Academy ini?
Ya. Setiap pelajaran React Academy menyertakan editor kode bawaan, jadi kamu menulis dan menjalankan kode nyata langsung di browser dan mendapatkan umpan balik AI instan — tidak diperlukan penyiapan lokal.
Semua pelajaran dalam kursus ini
- Dasar Konteks & Menghindari Penerusan Prop
- Dasar useReducer & Pola Aksi
- Konteks + Reducer: Wadah State Sederhana