Masukan terkontrol vs tidak terkontrol (pengantar)
Pahami perbedaan antara masukan terkontrol (nilai terikat ke state) dan masukan tidak terkontrol (DOM mengelola nilai).
Masukan terkontrol vs tidak terkontrol (pengantar) adalah pelajaran React Academy gratis di CoddyKit. Ini adalah pelajaran 3 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.
Ikhtisar
Tujuan: Bandingkan masukan terkontrol dan tidak terkontrol. Masukan terkontrol menggunakan status React sebagai sumber kebenaran; masukan tidak terkontrol menyerahkannya kepada DOM.
Masukan terkontrol
Masukan terkontrol: nilainya terikat pada status dan diperbarui melalui onChange. React selalu mengetahui nilai terbaru.
Contoh: masukan terkontrol
Masukan ini terkontrol: nilainya berasal dari status dan diperbarui setiap kali terjadi perubahan.
<div id="root"></div>
Masukan tidak terkontrol
Masukan tidak terkontrol: DOM menyimpan nilainya sendiri; Anda dapat membacanya dengan referensi hanya saat diperlukan.
Contoh: masukan tidak terkontrol
Di sini masukannya tidak terkontrol: React tidak mengelola nilainya; kita membacanya dengan referensi saat tombol diklik.
<div id="root"></div>
Kiat & pertimbangan
Kiat:
- Terkontrol = dapat diprediksi, status React mengendalikan antarmuka.
- Tidak terkontrol = lebih sederhana, tetapi kendalinya lebih terbatas.
- Masukan terkontrol lebih disarankan untuk formulir.
Pemeriksaan masukan terkontrol
Ringkasan
Ringkasan: Masukan terkontrol terikat pada status React sehingga lebih andal. Masukan tidak terkontrol membiarkan DOM mengelola nilai. Pilih masukan terkontrol untuk sebagian besar formulir.
Pertanyaan yang Sering Diajukan
Apakah pelajaran “Masukan terkontrol vs tidak terkontrol (pengantar)” gratis?
Ya — teks lengkap “Masukan terkontrol vs tidak terkontrol (pengantar)” 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 “Masukan terkontrol vs tidak terkontrol (pengantar)”?
Pahami perbedaan antara masukan terkontrol (nilai terikat ke state) dan masukan tidak terkontrol (DOM mengelola nilai). 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 3 dari 3.
Berapa lama pelajaran “Masukan terkontrol vs tidak terkontrol (pengantar)” 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 useState & pembaruan yang benar
- Penanganan event: onClick & onChange
- Masukan terkontrol vs tidak terkontrol (pengantar)