Как установить данные в state при первом рендере?
Есть компонент, в при загрузке страницы в его методе componentDidMount я делаю get-запрос на сервер:
componentDidMount: function () {
$.ajax({
type: 'GET',
url: '/adress',
data: data_storage,
success: function (data_storage) {
this.setState({data_storage: data_storage});
}.bind(this),
beforeSend: function () {
this.setState({loading: true});
}.bind(this)
});
},
Данные принимаю и устанавливаю их в state сразу. Далее они мне понадобятся для формирования компонента(это происходит с помощью методов на ходу и зависит от полученных данных). Вот тут и проблема, что при первом рендере data_storage является undefined и метод, который работает с этим параметром отваливается.НО если я уберу метод, то в консоль логе вижу,что компонент рендерится несколько раз-первый без data_storage, а второй с ним. В чем моя ошибка? Как мне это дело прописать так, чтобы он при первом рендере уже имел информацию и не ругался?
Добавил краткий пример работающего кода с ожиданием данных.
class Application extends React.Component {
constructor (props) {
super(props);
this.state = {
myData: undefined
}
}
componentDidMount () {
setTimeout(function () {
this.setState({
myData: {
param1: 'param1',
param2: 'param2',
param3: 'param3',
}
})
}.bind(this), 4000);
}
render () {
if (!this.state.myData) {
return <div>NO DATA</div>
}
return <div>
Test application
</div>
}
}
ReactDOM.render(<Application />, window.root)
Проверить работу можно тут
-
07:36
-
07:00
-
21:22
-
20:00
-
20:14
-
07:41
-
19:16
-
07:17
-
21:35
- Почему SERVER_ADDR имеет не тот IP 46622 visits
- Как заменить $_SERVER[REMOTE_ADDR] на IP клиента в PHP за двумя Nginx? 30270 visits
- Хочу вывести несколько строк из массива в один div, выводит только много undefined; подскажите, что делать? 22790 visits
- Как через css изменить цвет png изображения? 10157 visits
- Blob video url download 9796 visits
- Php curl запрос через прокси с авторизацией 9054 visits
- Работа с captcha vk api 7972 visits
© "hostciti.net" 19.4.2024 | 01:15