How to get fetch response before rendering DOM tree?

Question

React

I have a small component written in react and redux. In redux, the initial state is filled with dummies. My little component has an asynchronous function inside that receives data from the Internet and inserts it into the state. And here's the problem, first the component is rendered with empty ones, and when data comes from the Internet, it re-renders with good data. That is, rendering occurs twice. How to make the component wait for
data from the Internet, and not render dummies.
Code example

export function App() {
  useEffect(getWeatherAPI, []);
  return (
    <Provider store={store}>
      <Header />
      <TimeNavigation />
      <SirchPanel />
      <DailyWeather />
    </Provider>
  );
}

Answer 1

if (данные) {
  <Component/>
}

So?