Using useSWR() without key Doesn't return any data

[mohanas-scg]

export async function getData() {
  let res = await fetch("/api/product/", { cache: "no-store" });
  if (!res.ok) {
    throw new Error("Failed to fetch data");
  }
  return res.json();
}

const {
    data: productData,
    isLoading,
    mutate,
  }: SWRResponse<resProductFields[], any, any> = useSWR<resProductFields[]>(getData);

Here without key useSWR doesn't return any data can anyone explain this scenario?

[koba04]

Yeah, the key param is required, so you need to put a key like /api/product/ as the key.
https://swr.vercel.app/docs/api#parameters

[mohanas-scg]

Yes I agree, it is working for me but, why can't we just put the URL directly inside the fetcher function instead of passing it as a key? (is that key anything to do with caching👀?)

[koba04]

Yes, that is correct; we use the key internally to store data like cache and some internal state.
You can also pass a non-URL string as the key.

useSWR("product", getData);

[mohanas-scg]

Thank you @koba04 for the answer.