Question

我正在尝试从OpenWeather提取2个不同的API请求，以使用React-Native编写的天气应用程序。无论如何，我还是使用API的新手，但是我也想同时使用2。我经历了十几次琐事，无法正常工作。最不满的人看起来很直截了当，但是我一直在犯错。任何帮助，将不胜感激。这是最新的代码/尝试。我的小子一直说;或...之后...

let currentWeather => finalVals[0];

let dailyWeather => finalVals[1];

...错了，但是更改它们也无济于事。以下是我也使用的该教学语言的链接：https://medium.com/@gianpaul.r/fetching-from-multiple-api-endpoints-at-once-ffb1b54600f9

这是我的代码：

_getWeather = (lat, long) => {

     let currentWeather = fetch(`http://api.openweathermap.org/data/2.5/weather?lat=${lat}&lon=${long}&APPID=${API_KEY}`);
     let dailyWeather = fetch(`http://api.openweathermap.org/data/2.5/forecast?lat=${lat}&lon=${long}&APPID=${API_KEY}`);

     Promise.all([currentWeather, dailyWeather])
      .then(values => Promise.all(values.map(value => value.json())))
      .then(finalVals => {
        let currentWeather => finalVals[0];
        let dailyWeather => finalVals[1];

        this.setState({
          temperature: Math.floor((currentWeather.main.temp) - 273.15),
          name: currentWeather.weather[0].main,
          location: currentWeather.name,
          isLoaded: true
        });
      });
  };

Answer 1

叹息……在把头撞在墙上一个小时之后，我意识到我有本来应该没有的功能箭头。除非对此人有任何其他疑问，否则对此致以最深的歉意。

Answer 2

Eric，很高兴您发现您的错误！另外，您可以使用await语法极大地简化函数的可读性和清晰度。

  _getWeather = async(lat, long) => {

 let currentWeatherEndpoint = fetch(`http://api.openweathermap.org/data/2.5/weather?lat=${lat}&lon=${long}&APPID=${API_KEY}`);
 let dailyWeatherEndpoint = fetch(`http://api.openweathermap.org/data/2.5/forecast?lat=${lat}&lon=${long}&APPID=${API_KEY}`);

 let finalVals = await Promise.all([currentWeatherEndpoint, dailyWeatherEndpoint])

    let currentWeather = finalVals[0];
    let dailyWeather = finalVals[1];

    this.setState({
      temperature: Math.floor((currentWeather.main.temp) - 273.15),
      name: currentWeather.weather[0].main,
      location: currentWeather.name,
      isLoaded: true
  });

};

React-Native Promise.all和多个API请求

2 个答案: