获取数据完成后，React Native 从承诺中获取价值

Question

我试图从另一个调用 fetch promises 的函数中获取值，但它返回 undefined，我认为问题是结果不会等待被调用函数的进程直到它完成。

这是代码：

var myConnection = require('../components/connection');
var RequestToken = React.createClass({
getInitialState: function() {
    return {
    };
},
componentDidMount: function(){
    AsyncStorage.getItem('token').then((value) => {
        if(typeof value != null){
            this.setState({"token": value});
            // call this function
            this.catchToken(value);
        }
    }).done();
},
catchToken: async function(token){

    try{
        var URL = "http://someurl.com/";
        var params = {
            token:token
        }
        let val = await myConnection.now(URL,params);

            this.setState({
               responseAPI:val
            });
            // returned undefined
            console.error(this.state.responseAPI);
    }catch (e){
        console.error(e);
    }
}
});

和 connection.js

function timeout(ms, promise) {
return new Promise(function(resolve, reject) {
    setTimeout(function() {
        reject(new Error("Connection timeout"))
    }, ms);
    promise.then(resolve, reject);
});
}
var myConnection = {
now: async function(URL,params){
    //return "OK";
    var formData = new FormData();
    for (var k in params) {
        formData.append(k, params[k]);
    }
    timeout(10000, fetch( URL, {
        method: 'POST',
        headers: {
            'Accept': 'application/json',
            'Content-Type': 'multipart/form-data'
        },
        body: formData
    })).then(
        (response) => response.json()
    ).then((res) => {
        // result data
        return res;
    }).catch((error) => {
        console.error(error);
    }).done();
}
};
module.exports = myConnection;

有人能解释一下函数处理完成后如何获取返回值吗？

谢谢

Answer 1

您应该在组件中以这种方式处理承诺：

myConnection.now(URL,params)
 .then(val => {
   this.setState({
      responseAPI:val
   });
 })
 .catch(error =>{
   console.error(error);
 });

在 api 方面，您需要返回一个承诺（代码中的超时函数）：

var myConnection = {
  now: async function(URL,params){
  //return "OK";
  var formData = new FormData();
  for (var k in params) {
      formData.append(k, params[k]);
  }

//You need to return the promise
  return timeout(10000, fetch( URL, {
      method: 'POST',
      headers: {
          'Accept': 'application/json',
          'Content-Type': 'multipart/form-data'
      },
      body: formData
    })).then(
      (response) => response.json()
    ).then((res) => {
      // result data
      return res;
    }).catch((error) => {
      console.error(error);
    }).done();
  }
};

超时应该拒绝或解决承诺，如果 fetch 调用在这里，则更简单：

function timeout(ms, promise) {
  return new Promise(function(resolve, reject) {
  setTimeout(function() {
      reject(new Error("Connection timeout"))
  }, ms);
  fetch( URL, {
      method: 'POST',
      headers: {
          'Accept': 'application/json',
          'Content-Type': 'multipart/form-data'
      },
      body: formData
  })).then(
      (response) => response.json()
  ).then((res) => {
      // result data
      resolve(res);
  }).catch((error) => {
      reject(error);
  }).done();
  });
}