reactjs - componentWillMount for react functional component?

Question

I want to know for react class component we have componentWillMount() lifecycle method, where we can perform tasks before loading the component. Tasks like, a call to backend and use the response to show that data in that frontend. What if I want the same thing in a functional component? like I have used react chartJS and for that the data values I want to be retrieved from backend response, and then the chart will populate based on those datas.

I hope I explained the problem statement well, if not please ask for any information.

Answer 1

componentWillMount is call only one time before initial render. I make a sample code, check it out below

import React, { useState, useEffect } from "react";
import "./styles.css";

export default function App() {
  const [mounted, setMounted] = useState(false)

  if(!mounted){
    // Code for componentWillMount here
    // This code is called only one time before intial render
  }

  useEffect(() =>{
    setMounted(true)
  },[])

  return (
    <div className="App">
      
    </div>
  );
}