本机反应: 可能的未处理的承诺拒绝

我得到了以下错误:

Possible unhandled promise rejection (id:0: Network request failed)

这是承诺代码,我看不出有什么问题,有什么想法吗?

  return fetch(url)
.then(function(response){
return response.json();
})
.then(function(json){
return {
city: json.name,
temperature: kelvinToF(json.main.temp),
description: _.capitalize(json.weather[0].description)
}
})
.catch(function(error) {
console.log('There has been a problem with your fetch operation: ' + error.message);
});
}

编辑 :

我添加了一个 catch 函数,得到了一个更好的错误:

You passed an undefined or null state object; instead, use forceUpdate(). index.ios.js:64 undefined

这是 index.ios.js 代码。URL 很好,并且给我正确的 json 数据。我可以通过控制台日志看到 region.latituderegion.longitude都可以在 Api(region.latitude, region.longitude)中使用。但是 data是未定义的。

我仍然不知道发生了什么,为什么 data有问题,为什么它没有定义。

// var React = require('react-native'); --deprecated


// updated
import React from 'react';


// updated
import {
AppRegistry,
MapView,
View,
Text,
StyleSheet,
} from 'react-native';


/*
var {
AppRegistry,
MapView,
View,
Text,
StyleSheet
} = React;
*/ // -- depreciated




var Api = require('./src/api');


var Weather = React.createClass({
getInitialState: function() {
return {
pin: {
latitude: 0,
longitude: 0
},
city: '',
temperature: '',
description: ''
};
},
render: function() {
return <View style={styles.container}>
<MapView
annotations={[this.state.pin]}
onRegionChangeComplete={this.onRegionChangeComplete}
style={styles.map}>
</MapView>
<View style={styles.textWrapper}>
<Text style={styles.text}>{this.state.city}</Text>
<Text style={styles.text}>{this.state.temperature}</Text>
<Text style={styles.text}>{this.state.description}</Text>
</View>
</View>
},
onRegionChangeComplete: function(region) {
this.setState({
pin: {
longitude: region.longitude,
latitude: region.latitude
}
});


Api(region.latitude, region.longitude)
.then((data) => {
console.log(data);
this.setState(data);
});
}
});




        



var styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'stretch',
backgroundColor: '#F5FCFF'
},
map: {
flex: 2,
marginTop: 30
},
textWrapper: {
flex: 1,
alignItems: 'center'
},
text: {
fontSize: 30
}
});


AppRegistry.registerComponent('weather', () => Weather);
339407 次浏览

您应该将 catch ()添加到 Api 调用的末尾。当您的代码命中 catch ()时,它不会返回任何内容,因此当您尝试在其上使用 setState ()时,数据是未定义的。错误消息实际上也告诉了您这一点:)

Api 中的 catch 函数应该返回一些数据,这些数据可以由 React 类中的 Api 调用来处理,或者抛出新的错误,这些错误应该使用 React 类代码中的 catch 函数来捕获。后一种方法应该是这样的:

return fetch(url)
.then(function(response){
return response.json();
})
.then(function(json){
return {
city: json.name,
temperature: kelvinToF(json.main.temp),
description: _.capitalize(json.weather[0].description)
}
})
.catch(function(error) {
console.log('There has been a problem with your fetch operation: ' + error.message);
// ADD THIS THROW error
throw error;
});

然后在你的反应课上:

Api(region.latitude, region.longitude)
.then((data) => {
console.log(data);
this.setState(data);
}).catch((error)=>{
console.log("Api call error");
alert(error.message);
});

根据 this post,您应该在 XCode 中启用它。

  1. Click on your project in the Project Navigator
  2. Open the Info tab
  3. 单击“ App Transport Security Settings”左边的向下箭头
  4. Right click on "App Transport Security Settings" and select Add Row
  5. For created row set the key “Allow Arbitrary Loads“, type to boolean and value to YES.

enter image description here

在这里增加我的经验,希望可以帮助某人。

我在 Linux 的 Android 模拟器上遇到过同样的问题,那就是热重载。代码是正确的,因为每接受的答案和模拟器可以到达互联网(我需要一个域名)。

手动刷新应用程序使其工作。所以也许它与热重新加载有关。

删除生成文件夹 projectfile\android\app\build并运行项目

在我的例子中,我在 IP 127.0.0.1:8000中运行一个本地 Django 后端 随着世博会的开始。 只要确保 public domain中的服务器不是本地托管在您的计算机上。 如果它是本地托管找到本地 IP 地址,如 192.168.0.105或其他东西,并使用