How to call an async function inside a UseEffect() in React?

Question

I would like to call an async function and get the result for my UseEffect.

The fetch api examples i found on the internet are directly made in the useEffect functio

Answer 1

It would be best if you did what the warning suggests - call the async function inside the effect.

function blabla() {
    const [data, setData] = useState(null);

    useEffect(() => {
        axios.get(`http://url/api/data/1`)
         .then(result => {
            setData(result.data);
         })
         .catch(console.error)
    }, [setData]);

    return (
        

            this is the {data["name"]}
        
    );
}