0

我正在尝试用我的电脑和手机在本地测试我的 react 项目。我使用的是 JavaScript 而不是 TypeScript。当我在计算机上运行该项目时，一切正常，但是当我尝试将其加载到手机上时，出现错误：Unhandled Rejection (TypeError): undefined is not an object (evaluating 'scheduleArr.forEach'). 我认为我正在使用async并且await正确，因为此代码在我的计算机上运行。我很困惑为什么这段代码可以在一个平台上工作，但不能在另一个平台上工作。

async function getSchedule() {
  let scheduleArr = await axios.get('api/schedule/')
    .then(response => { 
      return response.data; 
     })
    .catch((error) => {
       console.log(`ERROR: ${error}`);
    });

  scheduleArr.forEach(game => {
    /* do stuff */
  }

});

我认为这个问题直接相关async，await因为当我注释掉这个函数时，我的项目在我的手机上正确加载。

谁能帮我理解我做错了什么？

4

2 回答 2

1

您不能将async/await模式与then. 要么像这样使用它：

async function getSchedule() {
    try {
      let scheduleArr = await axios.get("api/schedule/");
      console.log(scheduleArr.data);
    } catch (err) {
      console.log(`ERROR: ${err}`);
    }

    scheduleArr.forEach(game => {
      /* do stuff */
    });
  }

或使用默认模式：

function getSchedule() {
    axios
      .get("api/schedule/")
      .then(response => {
        let scheduleArr = response.data;

        // Do this inside the 'then'
        scheduleArr.forEach(game => {
          /* do stuff */
        });
      })
      .catch(error => {
        console.log(`ERROR: ${error}`);
      });
  }

请注意，我将您的foreach循环移到了then. 它是异步的，因此只有在您获得 api 调用的结果时才需要触发。

于 2021-02-06T22:26:37.890 回答
0

我弄清楚了问题所在。async await它与or无关axios。

这是我之前的代码

function getSchedule() {
    axios
      .get("http://localhost:5000/api/schedule/")
      .then(response => {
        let scheduleArr = response.data;

        // Do this inside the 'then'
        scheduleArr.forEach(game => {
          /* do stuff */
        });
      })
      .catch(error => {
        console.log(`ERROR: ${error}`);
      });
  }

我更改了我的 API 调用以使用我的实际本地 IP 而不是 localhost

function getSchedule() {
    axios
      .get("http://192.168.X.XX:5000/api/schedule/")
      .then(response => {
        let scheduleArr = response.data;

        // Do this inside the 'then'
        scheduleArr.forEach(game => {
          /* do stuff */
        });
      })
      .catch(error => {
        console.log(`ERROR: ${error}`);
      });
  }

将我的代码嵌套在.then块中确实修复了我的undefined错误，即使是错误的 url。谢谢你的建议@Quentin Grisel。

修复我的网址让我可以在不同的设备上进行测试。

于 2021-02-06T23:04:45.010 回答