0

I need to send a http request when the react component has loaded. I'm using the react useEffect function. The problem is that the useEffect function is called multiple times.

I searched and found that to call react useEffect once you need to add [] after the callback function. I tried this but it doesn't work. Thank you

This is my code:


const LoginPage = () => {

  useEffect(() => {
    console.log("Log");
  }, []);

  return (
    <div className="login-container">
      
    </div>
  );
};
export default LoginPage;

And this is the output console: enter image description here

Davide Bianchi
  • 21
  • 1
  • Take a look: https://stackoverflow.com/questions/48846289/why-is-my-react-component-is-rendering-twice – Paulo Fernando Dec 15 '22 at 13:50
  • Does this answer your question? [React 18 strict mode causing component to render twice](https://stackoverflow.com/questions/72489140/react-18-strict-mode-causing-component-to-render-twice) – Yana Trifonova Dec 15 '22 at 13:52
  • 2
    That red error in your console is unsettling – Konrad Dec 15 '22 at 13:54
  • @Konrad, the problem is not the red error but that the useEffect is called multiple times – Davide Bianchi Dec 15 '22 at 14:35
  • The error looks like you create the app more than once, hence multiple calls of `useEffect`. Also, `StrictMode` causes effects to run two times. Please show the file where you use `createRoot` – Konrad Dec 15 '22 at 14:37

0 Answers0