反应本机异步函数返回promise，但不是我的json数据？

Question

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

在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;
  }

在控制台中。log（json），我得到了正确的json对象列表，我可以使用json[0]访问它们。名称。但后来，控制台。日志（数据）返回包含奇数数据的promise：

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

... 我再也找不到我的json对象了。为什么会这样？更重要的是，如何在componentDidMount（）中检索json数据，以便将其设置为数据源？

Answer 1

或者另一种方式是

  async componentDidMount() {
    const { data: dataSource = [] } = await this.getData();   
    this.setState({dataSource})  
  }

这将复制你的数据到一个不可变的对象，一个重新命名的名称，也设置一个默认值的对象dataSource

Answer 2

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

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

Answer 3

由于getData（）是一个promise，您应该能够在then块中获得数据，如下所示：

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