我正在完成本地反应教程.对于某个屏幕,教师建议使用以下代码：
<Image source={bgImage} style={styles.backgroundContainer}>
<View style={styles.container}>
<Quote quoteText={this.props.text} quoteSource={this.props.source}/>
</View>
</Image>
但是当我使用它时,我得到了上述错误.
我已经尝试过替代方案,但是当我这样做时,背景图像甚至没有加载.
编辑：根据下面的要求,这是我的样式代码.我想要的是使用本地存储到应用程序代码的背景渐变图像,文本覆盖在该背景上.我目前通过使用下面的建议得到的只是屏幕顶部的文字,没有背景图片.
const styles = StyleSheet.create({
backgroundContainer: {
flex: 1,resizeMode: 'cover',width: undefined,height: undefined,backgroundColor: '#889DAD',},container: {
flex: 1,justifyContent: 'center',alignItems: 'center',backgroundColor: 'transparent',});
解决方法
您不能将其他组件放入图像组件中.您需要在图像周围包裹一个视图并将其定位为绝对图像.
<View style={{ flex: 1}}>
<Image source={bgImage} style={styles.backgroundContainer} />
<View style={styles.container}>
<Quote quoteText={this.props.text} quoteSource={this.props.source}/>
</View>
</View>
container: {
position: 'absolute',top: 0,bottom: 0,left: 0,right: 0,
编辑：
从react-native版本50.0开始,您只需使用ImageBackground即可
