![](/img/trans.png)
[英]Axios Promise Handling - Getting “Possible Unhandled Promise Rejection - TypeError: Network request failed” in react-native
[英]React Native: Possible unhandled promise rejection (id: 0) TypeError: Network request failed
我收到以下错误:可能未处理的承诺拒绝(id:0):网络请求失败。 在此处输入图片说明
我试图在 firebase 中用文字和图片传达评论。 在 ReviewsScreen.js 中实现数据的显示和接受,在 Fire.js 中处理和发送。 我认为 Fire.js 中的某个地方存在错误,但我不知道问题是什么
评论Screen.js
import React, { Component } from 'react';
import {
StyleSheet,
View,
TouchableOpacity,
Text,
SafeAreaView,
Image,
TextInput,
SafeAreaViewBase
} from 'react-native';
import Icon from 'react-native-vector-icons/Ionicons'
import {h, w} from '../../constants'
import Fire from '../../Fire'
import ImagePicker from 'react-native-image-picker';
const options = {
title: 'Select photo',
};
export default class ReviewsScreen extends Component {
state = {
text: '',
image: null
}
pickImage = () => ImagePicker.showImagePicker(options, (response) => {
console.log('Response = ', response);
if (response.didCancel) {
console.log('User cancelled image picker');
} else if (response.error) {
console.log('ImagePicker Error: ', response.error);
} else {
// You can also display the image using data:
// const source = { uri: 'data:image/jpeg;base64,' + response.data };
this.setState({
image: response.uri
});
}
});
handleReview = () => {
Fire.shared.addReview({text: this.state.text.trim(), localUrl: this.state.image}).then(ref => {
this.setState({text: '', image: null})
this.props.navigation.goBack()
}).catch(error => {
alert(error)
})
}
render() {
return (
<SafeAreaView style={styles.container}>
<View style={styles.header}>
<TouchableOpacity onPress={() => this.props.navigation.goBack()}>
<Icon name='md-arrow-back' size={24} color='blue'/>
</TouchableOpacity>
<TouchableOpacity onPress={this.handleReview}>
<Text style={{fontWeight: '500'}}>Добавить</Text>
</TouchableOpacity>
</View>
<View style={styles.inputContainer}>
<Image source={require('./img/avatar.jpg')} style={styles.avatar}/>
<TextInput
autoFocus={true}
multiline={true}
numberOfLines={1}
style={{flex: 1}}
placeholder='Нам важно ваше мнение!'
onChangeText={text => this.setState({ text })}
value={this.state.text}
>
</TextInput>
</View>
<TouchableOpacity style={styles.photo}
onPress={this.pickImage}>
<Icon name='md-camera' size={32} color="#D8D9D8"></Icon>
</TouchableOpacity>
<View syle={{marginHorizontal: 32, marginTop: 32, height: 150}}>
<Image source={{uri: this.state.image}} style={{ marginTop: 32, alignSelf: 'center', width: '50%', height: '50%'}} />
</View>
</SafeAreaView>
)
}
}
火.js
import firebaseConfig from './config'
import firebase from 'firebase'
class Fire {
constructor() {
firebase.initializeApp(firebaseConfig);
}
addReview = async ({ text, localUri }) => {
const remoteUri = await this.uploadPhotoAsync(localUri);
return new Promise((res, rej) => {
this.firestore
.collection("reviews")
.add({
text,
uid: this.uid,
timestamp: this.timestamp,
image: remoteUri
})
.then(ref => {
res(ref);
})
.catch(error => {
rej(error)
});
});
};
uploadPhotoAsync = async uri => {
const path = `photos/${this.uid}/${Date.now()}.jpg`;
return new Promise(async (res, rej) => {
const response = await fetch(uri);
const file = await response.blob();
let upload = firebase
.storage()
.ref(path)
.put(file);
upload.on(
"state_changed",
snapshot => {},
err => {
rej(err);
},
async () => {
const url = await upload.snapshot.ref.getDownloadURL();
res(url);
}
);
});
};
get firestore() {
return firebase.firestore();
}
get uid() {
return (firebase.auth().currentUser || {}).uid;
}
get timestamp() {
return Date.now();
}
}
Fire.shared = new Fire();
export default Fire;
你写的是“localUrl”而不是“localUri”: Fire.shared.addReview({text: this.state.text.trim(), localUrl: this.state.image}).then(ref => {
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.