Обработка второго ответа при выполнении нескольких запросов GET в React
Мне удалось передать первый ответ в данные имени состояния (this.state.data) компонента. Но когда я пытаюсь выполнить второй запрос data1 из другого API, он не отображается. Оба ответа хороши после проверки в инструменте разработки, а первый я могу использовать данные.
class WeatherApp extends React.Component {
constructor(props) {
super(props);
this.state = {
error: null,
isLoaded: false,
data: [],
data1: []
};
}
componentDidMount() {
Promise.all([
fetch("weatherAPI.php"),
fetch("weatherAPIToday.php")
]).then(([res, res1]) => res.json())
.then((result, result1) => {
this.setState({
isLoaded: true,
data: result,
data1: result1
}, console.info(result));
},
(error) => {
this.setState({
isLoaded: true,
error
});
}
);
}
Ага. Получил прямо из документации React. Вы можете увидеть мой код для работы двух выборок. mysite-thiettan.c9users.io/reactTest.html
Я имею в виду массив и все такое. Он вызывает массив или элементы в массиве?
Честно говоря не уверен. Я новичок в этом. Но я думал, что Promise.all вызывает все элементы массива выборки.
Я бы Promise.all([fetch("weatherAPI.php").then(res=>res.json()), fetch("weatherAPIToday.php").then(res=>res.json())]).then(([json, json1]) => { ... handle data here })
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Поскольку и res, и res1 возвращают обещание, все, что вам нужно сделать, это заключить их в Promise # all
Promise.all([
fetch("weatherAPI.php"),
fetch("weatherAPIToday.php")
]).then(([res, res1]) => Promise.all(res.json(), res1.json()))
.then((result, result1) => {
this.setState({
isLoaded: true,
data: result,
data1: result1
}, console.info(result));
})
.catch(error => {
this.setState({ isLoaded: true, error });
});
почему не Promise.all([ fetch("weatherAPI.php").then(res=>res.json()), fetch("weatherAPIToday.php").then(res=>res.json()) ])
На самом деле @Bravo личные предпочтения. Я подумал, что сохраню его так, как он написал свой.
Привет спасибо! Но тогда это дает мне ошибку: # <Promise> не повторяется
Это допустимый синтаксис для вызова fetch?