createResource refetch causes full page refresh

I'm using SolidStart, dabbling for the first time with data fetching using Solid, apologies in advance for any simple misunderstandings.

I've got an API route giving me a list of projects which I've put into a resource in the following manner:

/* ... */
const [projects, { refetch: refetchProjects }] = createResource(getProjects);
/* ... */

/* ... */
const [projects, { refetch: refetchProjects }] = createResource(getProjects);
/* ... */

/* ... */
const [projects, { refetch: refetchProjects }] = createResource(getProjects);
/* ... */

/* ... */
const [projects, { refetch: refetchProjects }] = createResource(getProjects);
/* ... */

The fetching function itself is as follows

async function getProjects() {
  const response = await fetch("/api/projects", { method: "GET" });
  if (response.ok) {
    return response.json();
  } else {
    return [];
  }
}

async function getProjects() {
  const response = await fetch("/api/projects", { method: "GET" });
  if (response.ok) {
    return response.json();
  } else {
    return [];
  }
}

async function getProjects() {
  const response = await fetch("/api/projects", { method: "GET" });
  if (response.ok) {
    return response.json();
  } else {
    return [];
  }
}

async function getProjects() {
  const response = await fetch("/api/projects", { method: "GET" });
  if (response.ok) {
    return response.json();
  } else {
    return [];
  }
}

When manually triggering

refetchProjects()

refetchProjects()

refetchProjects()

refetchProjects() in an

onClick

onClick

onClick

onClick the entire page flashes white in what seems like a full page reload. Any ideas as to what I'm doing wrong? Are resources the wrong solution?

createResource refetch causes full page refresh

Similar Threads

Similar Threads

Similar Threads