SolidJS•7d ago

How to prevent page reload on action / query

I use lazy loading, defining preload function, deferStream, and I can see visibly the data added in real time to the page but it forcefully refreshes the page How do I stop this? I didn't think server actions were meant to do this anyways

const addMenuItemToDatabase = action(async (formData: FormData) => {
  "use server";
  ...
return reload({
      revalidate: queryMenuItems.keyFor(formData.get("userId")!.toString()),
    });
});

const addMenuItemToDatabase = action(async (formData: FormData) => {
  "use server";
  ...
return reload({
      revalidate: queryMenuItems.keyFor(formData.get("userId")!.toString()),
    });
});

export const route = {
  preload() {
    return queryMenuItems(useSessionContext().userData.id);
  },
} satisfies RouteDefinition;

export const route = {
  preload() {
    return queryMenuItems(useSessionContext().userData.id);
  },
} satisfies RouteDefinition;

and then a simple server query

4 Replies

ⱼ ₒ ₑOP•7d ago

Ok well it work in a prod. server but not dev. That's all.

Hussein•7d ago

you most likely have a hydration issue in your app like you might be importing a server module and its not being tree-shaken well

ⱼ ₒ ₑOP•5d ago

So it's supposed to work identical to production on dev server and shouldn't be doing a full refresh?

Hussein•5d ago

yes

Gaming

Programming

How to prevent page reload on action / query

Did you find this page helpful?