react-native async 函数返回 promise 但不是我的 json 数据？

Question

我正在学习 react-native，但遇到了一个问题。为什么在从异步函数返回时获取数据会返回一个承诺，但在异步函数本身中，它会正确返回一个对象数组？

在 componentDidMount() 上，我调用我的异步函数，该函数依次获取一个 api url：

   componentDidMount() {
    let data = this.getData();
    console.log(data);    // <-- Promise {_40: 0, _65: 0, _55: null, _72: null}
    this.setState({
      dataSource:this.state.dataSource.cloneWithRows(data),
    })
  }

  async getData() {
    const response = await fetch("http://10.0.2.2:3000/users", {
            method: 'GET',
            headers: {
                'Accept': 'application/json',
                'Content-Type': 'application/json',
            }
        });
    const json = await response.json();
    console.log(json);     // <-- (5) [Object, Object, Object, Object, Object]
    return json;
  }

在 console.log(json) 中，我得到了正确的 json 对象列表，我可以使用 json[0].name 访问它们。但后来， console.log(data) 返回一个带有奇数数据的承诺：

 Promise {_40: 0, _65: 0, _55: null, _72: null}

…而且我再也找不到我的 json 对象了。为什么是这样？更重要的是，如何在 componentDidMount() 中检索我的 json 数据，以便将其设置为 dataSource ？

原文由 tempomax 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

由于 getData() 是一个承诺，您应该能够获取 then 块中的数据，如下所示：

 componentDidMount() {
  this.getData()
    .then((data) => {
      this.setState({
        dataSource:this.state.dataSource.cloneWithRows(data),
      })
    });
}

原文由 Anthony Ngene 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

另一种类似于提问者原代码的做法：

 async componentDidMount() {
    let data = await this.getData();
    console.log(data);
    this.setState({
      dataSource:this.state.dataSource.cloneWithRows(data),
    })
  }

原文由 itinance 发布，翻译遵循 CC BY-SA 3.0 许可协议