React Native Fetch:第二个承诺悬挂

时间:2016-03-28 13:58:56

标签: javascript reactjs promise react-native fetch-api

React Native的fetch存在奇怪的问题。 它以前工作,不知道我改变了什么,但它已停止工作。

login(data,success,fail){
    console.log('doing fb login');
    fetch(host+'/api/login?credentials='+data.credentials)
        .then( (response) => {
            console.log('got login response');
            return response.json();
        } )
        .then( json => {
            console.log('got login json');
            if(json.result!='fail'){
                success(json);
            } else {
                fail(json);
            }
            return json;
        })
        .catch((error) => {
          console.warn(error);
        });
}

问题是我看到第一个“获得登录响应”消息,但随后它就会挂起,直到我按下屏幕“触发登录json”并按预期继续时才会发生任何事情。

这令人沮丧,因为这种情况一直在发生,我无法理解为什么第二个.then()没有自动触发。

非常感谢任何帮助。

编辑:发现了一个类似的问题:What could be causing this slow fetch in react native?

似乎已经在查看:https://github.com/facebook/react-native/issues/6679

此行为仅在Chrome调试工具启用时才会出现......有趣

2 个答案:

答案 0 :(得分:0)

response.json() is a promise,而非价值。所以它不会为你解决。 我还会根据response.status而不是json.result来检查结果,因为在某些情况下服务器的响应将无法转换为json(例如401)。

.then( (response) => {
   if (response.status >= 200 && response.status < 300) {
      response.json().then((data) => success(data));
   } else {
      fail(response);
   }
})

答案 1 :(得分:-1)

console.log是阻塞语句。同步程序会停止执行代码,直到代码被解析为止,但如果该选项卡不在前台,则与Chrome Debug一起使用会很慢。