有谁知道如何解决此错误?
"更新属性' src'时出错管理的视图: RCTImageView"
组件渲染时会出现此错误。我认为图像没有给他们时间下载或类似的东西。
的依赖性: " firebase":" ^ 4.8.2", "反应":" 16.0.0-alpha.12", " react-native":" 0.47", " react-native-image-picker":" ^ 0.26.7",
Gallery.js
import React, { Component } from 'react';
import { View, Image, ScrollView, StyleSheet, Dimensions } from 'react-native';
import { connect } from 'react-redux';
import firebase from '../../config/firebase';
import { nameChanged } from '../../actions';
import { CardSectionTransp, InputBlack } from '../common';
import { SnapshotToArray } from '../../config/helpers';
const { width, height } = Dimensions.get('window');
class EventDetail extends Component {
constructor(props) {
super(props);
this.state = {
images: [],
objImages: []
};
}
componentWillMount() {
firebase.database().ref().child('images').orderByChild('order').once('value', snapshot => {
const images = SnapshotToArray(snapshot);
this.setState({ objImages: images });
const arrayImages = [];
for (const image of images) {
const starsRef = firebase.storage().refFromURL('gs://bealegendapp.appspot.com/images/' + image.path);
// Get the download URL
starsRef.getDownloadURL().then((url) => {
arrayImages.push(url);
this.setState({ objImages: arrayImages });
}).catch((error) => {
// A full list of error codes is available at
// https://firebase.google.com/docs/storage/web/handle-errors
switch (error.code) {
case 'storage/object_not_found':
// File doesn't exist
break;
case 'storage/unauthorized':
// User doesn't have permission to access the object
break;
case 'storage/canceled':
// User canceled the upload
break;
case 'storage/unknown':
// Unknown error occurred, inspect the server response
break;
default:
break;
}
});
}
});
}
onNameChange(text) {
this.props.nameChanged(text);
}
render() {
return (
<ScrollView style={styles.container}>
<CardSectionTransp>
<InputBlack
label="Nombre"
onChangeText={this.onNameChange.bind(this)}
value={this.props.name}
/>
</CardSectionTransp>
<View style={{ flex: 1, flexDirection: 'row', flexWrap: 'wrap', marginTop: 10 }}>
{this.state.objImages && this.state.objImages.length > 0 &&
this.state.objImages.map((image, key) => {
return (
<View key={key} style={{ width: width / 3 }}>
<Image <-------------EEEEEEERRRRRRRROOOOOOORRRRRRR!!!!
source={{ uri: image }}
style={styles.image}
/>
</View>
);
})
}
{this.props.photos &&
this.props.photos.map((image, key) => {
return (
<View key={key} style={{ width: width / 3 }}>
<Image
source={{ uri: image }}
style={styles.image}
/>
</View>
);
})
}
</View>
</ScrollView>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#F5FCFF',
paddingBottom: 123
},
image: {
height: height / 5,
resizeMode: 'contain',
width: width / 3,
borderWidth: 1,
borderColor: 'white'
}
});
const mapStateToProps = ({ gallery }) => {
const { name, photos } = gallery;
return { name, photos };
};
export default connect(mapStateToProps, {
nameChanged
})(EventDetail);
答案 0 :(得分:0)
对于发生此问题的其他任何人-我也有此问题,并暂时通过以下方法解决了该问题:
{ this.state.myImage !== '' ?
<View>
<Image source={this.state.myImage} />
<Button title="keep img?" onPress={this.setImage} />
</View>
:
null
}