Fetcher

The imperative fetcher returned by router.createFetcher.

Compatibility

ReactAvailable in this renderer's browser integration.

React SSRAvailable to this renderer's SSR integration; browser event handlers run after hydration.

PreactAvailable in this renderer's browser integration.

Preact SSRAvailable to this renderer's SSR integration; browser event handlers run after hydration.

Import from @kasperrt/smolter/react @kasperrt/smolter/preact

Signature

interface Fetcher {
  getSnapshot: () => FetcherSnapshot;
  subscribe: (listener: () => void) => () => void;
  load: (url: string) => Promise<Result>;
  submit: (
    url: string,
    body: FormData,
    options?: SubmitOptions,
  ) => Promise<Result>;
  /** Abort work and release subscriptions when this imperative fetcher is no longer used. */
  dispose: () => void;
}

Usage

The imperative fetcher returned by router.createFetcher. subscribe returns an unsubscribe function. load reads; submit mutates; dispose aborts work and clears subscriptions. UI components normally use useFetcher instead.

const fetcher = router.createFetcher();
await fetcher.load("/tasks/1");
console.log(fetcher.getSnapshot().data);
fetcher.dispose();

Fields

getSnapshot

getSnapshot: () => FetcherSnapshot;

subscribe: (listener: () => void) => () => void;

load

load: (url: string) => Promise<Result>;

submit

submit: (
    url: string,
    body: FormData,
    options?: SubmitOptions,
  ) => Promise<Result>;

dispose

dispose: () => void;

Abort work and release subscriptions when this imperative fetcher is no longer used.

View implementation ↗

smolter_