How to call the loading function with React useEffect only once in ReactJS

Hello React developers, Today We are Going To Learn About How to call the loading function with React useEffect only once in ReactJS. We are going to Learn about All Possible Methods So Lets Get Start with This Tutorial.

How to call the loading function with React useEffect only once in ReactJS?

Method 1: Use useEffect

You Can Use Your Function In useEffect That will Run Your Function Only Once. Here is My Example.

const runThisFunOnce = () => {
  console.log("runThisFunOnce");
};

function YourComponent() {

  useEffect(() => {
    runThisFunOnce();
  }, []);

  return <div> .... </div>;
}

Now, You Can Run Your runThisFunOnce function only once.

Method 2: Use useMountEffect

You can Also Use useMountEffect And Declare Your Function in and Then Your Function will run only once. Here is My Example.

const runThisFunOnce = () => {
  console.log("runThisFunOnce");
};

function MyComponent() {

    const useMountEffect = (fun) => useEffect(fun, [])

    useMountEffect(runThisFunOnce)
    return <div>...</div>;

}

Now, Your Function Will Run for once.

Conclusion

It’s all About this Tutorial. Hope This Tutorial is Helped You. Comment below Your thoughts and your queries. Also, Comment below which Method worked for you? Thank You.

Also, Read

• Message: session not created: This version of ChromeDriver only supports Chrome version 96 Current browser version is 98