Wasp•4mo ago

When i load a page it executes an action twice

  if (userSalesdataEx && credsExist){
    console.log("Loading new data...")
   getAndStoreNewData(); // Voeg hier de benodigde argumenten toe
  }

  if (userSalesdataEx && credsExist){
    console.log("Loading new data...")
   getAndStoreNewData(); // Voeg hier de benodigde argumenten toe
  }

I have this in my component.tsx file which on its end is a component loaded into a page

export function Page() {
  return (
    <div >
<Page></Page>
    </div>
  );
}

export function Page() {
  return (
    <div >
<Page></Page>
    </div>
  );
}

Now the function that i have now is ran twice when i open the page. I only want this function to run once since it executes an actoin on the server, how come this?

6 Replies

kapa.ai•4mo ago

Hi @Sven. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- The issue you're experiencing might be related to React's StrictMode. As mentioned in one of the knowledge sources (https://github.com/wasp-lang/wasp/issues/1272), when StrictMode is enabled in React 18, each component is rendered twice in development. This could be causing your getAndStoreNewData() function to be called twice. This is particularly problematic if your function is making a request to a backend server and the token used for that request is only valid once. In such a case, the second request would end with an error, as the token would no longer be valid. If you're using StrictMode, you might want to consider disabling it during development or modifying your function to prevent it from making a second request if it's already been called. However, keep in mind that this is a feature of React's StrictMode and it's intended to help catch potential problems in an application, so it's generally recommended to use it during development. If you're not using StrictMode or the issue persists after disabling it, there might be another cause for the function being called twice. Without more information, it's difficult to provide a more specific solution. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ---------------------- Sorry @Sven, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist: Perhaps try again in 15mins?

SvenOP•3mo ago

No? Would like help on this

miho•3mo ago

This is the expected behaviour with React 18 and our settings with using Strict Mode. For very specific cases you can use this trick: https://stackoverflow.com/a/72843344

Stack Overflow

How to handle useEffect being called twice in strictMode for things...

I understand that React calls useEffect twice in strict mode, this question is about asking what the correct way of handling it is. I have recently hit an issue with React useEffect being called tw...

SvenOP•3mo ago

would in production app this also happen or then there is no stric omde?

miho•3mo ago

Strict mode only runs things twice in development and not in production 😄

SvenOP•3mo ago

Nicenice

Gaming

Programming

When i load a page it executes an action twice