Hook
Hook adalah pola umum dalam kerangka kerja di mana nilai berubah atau peristiwa lain terjadi. Dengan cara terpusat, Hook menyuntikkan kode Anda sendiri untuk dijalankan saat status berubah atau pada tahap lain dalam siklus hidup aplikasi.
Hook Efek
Dalam unit ini, kita akan fokus pada Hook Efek. Hook ini diajukan setiap kali nilai status diatur. Hook diajukan ketika nilai awal dan semua pembaruan berikutnya diatur.
Hook Efek memungkinkan Anda menjalankan kode sebagai respons terhadap pengaturan nilai. Kode yang Anda jalankan dapat memiliki efek samping, sehingga Anda dapat memperbarui nilai sesuai kebutuhan.
Kapan menggunakan Hook Efek
Anda dapat menggunakan Hook Efek kapan pun Anda perlu memusatkan kode untuk merespons perubahan status. Bayangkan bentuk kompleks yang mencakup banyak nilai. Anda biasanya harus menonaktifkan tombol Kirim hingga data yang perlu dikirim ke server dalam keadaan valid. Katakanlah Anda memiliki peristiwa untuk nilai individual yang diubah dalam data. Setelah pengguna memilih negara/wilayah di aplikasi Anda, Anda perlu mengambil daftar provinsi dari server.
Anda tidak ingin setiap pemerhati kejadian memeriksa status untuk melihat apakah data siap dikirim ke server. Pengaturan ini tidak akan efisien. Sebagai gantinya, Anda dapat menggunakan Hook Efek. Hook Efek dapat membuat satu fungsi yang melihat data. Jika data dalam status valid, data dapat mengaktifkan tombol Kirim.
useEffect
Untuk mendaftarkan pendengar untuk Hook Efek, gunakan useEffect. useEffect menerima fungsi tanpa parameter untuk dijalankan saat status berubah.
useEffect(() => {
// code goes here
});
Secara default, useEffect berjalan setiap kali status diubah pada objek stateful apa pun. Anda dapat memberikan dependensi untuk mengaktifkan Hook hanya untuk grup objek tertentu.
useEffect(() => {
// code goes here
}, [ someStatefulObject ]);