⚡ useFetcher Nedir?

• React Router v6+ ile gelen hook’tur.
• Route dışı form veya action çağrıları yapmak için kullanılır.
• Component, loader veya action ile doğrudan bağlı olmayan veri göndermeyi sağlar.

⚡ Temel Kullanım

import { useFetcher } from "react-router-dom";

function SubscribeForm() {
  const fetcher = useFetcher();

  return (
    <fetcher.Form method="post" action="/subscribe">
      <input type="email" name="email" placeholder="Email" />
      <button type="submit">Abone Ol</button>
    </fetcher.Form>
  );
}

• fetcher.Form → React Router action’a veri gönderir.
• fetcher.submit(data, { method: "post" }) → Programatik olarak veri gönderir.
• fetcher.state → Yükleme durumunu (idle, submitting, loading) takip eder.

⚡ Notlar

• useFetcher, sayfa değişmeden veri gönderme ve alma işlemleri için idealdir.
• Loader veya action ile bağlantılı olmayan küçük formlar için kullanılır.
• useFetcher sayesinde route yeniden render edilmeden veri güncellenebilir.
• UI geri bildirimleri ve spinner’lar için fetcher.state kullanılır.