Спасибо за ответы, по вашим подсказкам все заработало!
Я его, правда, изменил и в итоге код стал такой:
export default class App extends Component {
constructor(props) {
super(props);
this.state = {
weather: {},
isReadyToRender: false
}
}
askForWeather = new AskForWeather();
openData = () => {
this.askForWeather.getNeededData().then(weather => {
this.setState({
weather: weather,
isReadyToRender: true // стейт обновился, флаг стал true
});
})
}
componentDidMount() {
let timerId = setTimeout(() => {
this.openData();
}, 5000);
this.openData();
}
render() {
if (this.state.isReadyToRender) { //если стейт обновлен и флаг в нем изменен на true
return(
<div className= "container">
<Header />
<Main temperature={this.state.weather.main.temp} />
<Additional />
</div>
);
} else {
return null;
}
}
}
То есть, пока стейт не обновится, ничего рендерится не будет. Как только в стейт пришли данные, стейт отрисовался. Правильно сделал?
И еще, получается, в методе render() вместо if надо бы использовать промис, который ожидает изменения флага isReadyToRender и только потом возвращает верстку? Или текущий вариант тоже норм(для новичка =))?