我收到以下错误: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.latitude
和region.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);
7条答案
按热度按时间ljsrvy3e1#
API中的catch函数应该返回一些数据,这些数据可以由React类中的Api调用处理,或者抛出新的错误,这些错误应该使用React类代码中的catch函数捕获。后一种方法应该类似于:
然后在您的React类中:
n8ghc7c12#
您应该在API调用的末尾添加catch()。当您的代码命中catch()时,它不会返回任何内容,因此当您尝试对数据使用setState()时,数据是未定义的。错误消息实际上也告诉您这一点:)
dluptydi3#
根据this post,您应该在XCode中启用它。
1.在项目导航器中单击您的项目
1.打开信息选项卡
1.单击“应用程序传输安全设置”左侧的向下箭头
1.右键单击“应用程序传输安全设置”并选择“添加行
1.对于已创建的行,设置键“允许任意加载”,键入布尔值并将值设置为YES。
pcww981p4#
加上我的经验,希望能帮助到别人。
我在Linux中的Android模拟器上也遇到了同样的问题,需要热重载。根据接受的答案,代码是正确的,模拟器可以访问互联网(我需要一个域名)。
手动刷新应用程序使它工作。所以也许这与热重新加载有关。
8yparm6h5#
在我的例子中,我运行的是一个本地Django后端,IP地址为
127.0.0.1:8000
,Expo启动。只要确保你的服务器在public domain
中,而不是在你的机器上本地托管。如果它是本地托管的,找到本地IP地址,如192.168.0.105
或其他地址,并使用它raogr8fs6#
对于我在catch工作中添加返回错误,也许您可以给予一下:
pxy2qtax7#
删除构建文件夹
projectfile\android\app\build
并运行项目