React33 / 78

Fetch & AbortController

Gunakan AbortController untuk membatalkan request network HTTP fetch jika komponen unmount sebelum respon tiba.

👀 Contoh dulu

useEffect(() => {
  const controller = new AbortController();
  fetch(url, { signal: controller.signal });
  return () => controller.abort();
}, [url]);

Hasilnya: Mencegah race condition dan pencemaran state dari request usang.

💡 AbortController adalah standar pencegahan race condition di React.

📝 Sekarang giliranmu

Untuk mencegah request diteruskan saat komponen sudah di-unmount, panggil metode abort() pada objek controller di dalam fungsi cleanup.

Preview