How to show preloader on pages before getting data?

Question

React

Hello.
Task: to implement in one place the logic of displaying the preloader for the page.
Now it works like this:
in redux there is a requestNames: [] field, an array containing strings with a request name.
in the request method there is a function that, before sending the request, will add a string with the name of the request to the array, and at the end, when the request is completed - the server will respond, a function will work that will remove this request name from the request array.
In page rendering, I get an array of current request names. And I compare, if the name of the current request matches the specified request name for the current page, then I show the preloader.
But right now, the problem is that initially the array is empty and such a comparison will return false and there will be such behavior:
the content of the page will flash with empty data, then the preloader will show, and then the content of the page will show with the received data

Answer 1

The idea with a string in an array sounds like nonsense.
A request to the server is an asynchronous operation, you call it from a component and you can chain it in it using then
Make a state in the component isLoading: false
Before calling the request, change it to true, and when you get a response from the server in then/catch/finally - disable loader