How the loading of each request in react is encapsulated and automatically associated with the component

A global loading is not satisfied. It requires a separate loading state for each request. How can this be encapsulated to make it easy to use?
I have encapsulated a http, that contains loading status. How can I automatically setState it to the component? Now I need to put the this into every ajaxApi (this) call, which is very inconvenient. There are a lot of loading to be maintained on the page, and different interfaces are not passed four or five times. How to automatically associate with components

Nov.19,2021

when the show request is completed, hide needs to configure two methods


to directly encapsulate a public request method. Loading is added to the encapsulation method.


what I do is set an isLoading logo with mobx. On the home page, the first page is put into the loading component, and the loading component is displayed by judging the isLoading. At the beginning of each request, modify the isLoading=true, request through mobx and change it to false

.
MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1eb51b7-4726d.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1eb51b7-4726d.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?