score:2

Accepted answer

before you fire the api call, set the loading state to true. when your api call completes or fails, set the loading state to false.

const [loading, setloading] = usestate(false);

const apicall = () => {

    // before you fire the api call, set the loading state to true.
    setloading(true);

    axios.get('api/endpoint')
        .then(res => {
            setcontext(prev => ({...prev, state: res.data})))

            // when your api call completes or fails, set the loading state to false.
            setloading(false);
        })
        .catch(e => {
            console.log(e);

            // also need to set loading to false if your request fails
            setloading(false);
        });
}

then use the loading state variable to control your components (eg. show a spinner).

<button loading={loading} ... />

Related Query

More Query from same tag