javascript - 组件不能包含子组件。如果你想在图像之上渲染内容，可以考虑使用绝对定位

Question

我正在完成有关 React Native 的教程。对于某个屏幕，导师推荐如下代码:

<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',
  },
});

Answer 1

从 react-native 0.50 开始，你不能在 <Image> 中嵌套组件。标签，而你必须使用 <ImageBackground> 用于背景图像。 Release Notes for v0.50.0