react-native异步函数返回promise而不是我的json数据?

tem*_*max 16 javascript async-await react-native ecmascript-2017

我正在学习反应原生,我遇到了一个问题.为什么从异步函数返回数据会返回一个promise,但在async函数本身,它会正确返回一个对象数组?

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;
  }
Run Code Online (Sandbox Code Playgroud)

console.log(json),我得到正确的json对象列表,我可以使用它来访问它们json[0].name.但稍后,console.log(data)返回奇数数据的承诺:

Promise {_40: 0, _65: 0, _55: null, _72: null}
Run Code Online (Sandbox Code Playgroud)

......我再也找不到我的json对象了.为什么是这样?更重要的是,如何检索我的json数据,componentDidMount()以便将其设置为dataSource

小智 22

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

componentDidMount() {
  this.getData()
    .then((data) => {
      this.setState({
        dataSource:this.state.dataSource.cloneWithRows(data),
      })  
    });
}
Run Code Online (Sandbox Code Playgroud)


iti*_*nce 6

类似于发问者原始代码的另一种方法:

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