使用React元素的卡片上的道具样式键"0"上的道具类型消息失败

Question

Im使用react原生元素创建一张卡。这是我的代码

return (
<Fragment>
<Card
title='HELLO WORLD'
image={require('../../Assets/healthy.jpeg')}>
<Text style={{marginBottom: 10}}>
The idea with React Native Elements is more about component structure than actual design.
</Text>
</Card>
</Fragment>
);

}；

但是我收到这个信息

警告：失败的道具类型：提供给Image的道具样式键0无效。│错误的对象：{│"0"：{│"width"：空，│"高度"：150│ },│"位置"："绝对"，│"left"：0，│"右"：0，│"顶部"：0，│"底部"：0│ }│有效密钥：[│"显示"，│"宽度"，│"高度"，│"启动"，│"结束"，│"顶部"，│"left"，│"对"，│"底部"，│"minWidth"，│"maxWidth"，│"minHeight"，│"maxHeight"，│"保证金"，│"marginVertical"，│"marginHorizontal"，│"marginTop"，│"marginBottom"，│"marginLeft"，│"marginRight"，│"marginStart"，│"marginEnd"，│"填充"，│"paddingVertical"，│"paddingHorizontal"，│"paddingTop"，│"paddingBottom"，│"paddingLeft"，│"paddingRight"，│"paddingStart"，│"paddingEnd"，│"borderWidth"，│"borderTopWidth"，│"borderStartWidth"，│"borderEndWidth"，│"borderRightWidth"，│"borderBottomWidth"，│"borderLeftWidth"，│"位置"，│"flexDirection"，│"flexWrap"，│"justifyContent"，│"alignItems"，│"alignSelf"，│"alinContent"，│"flex"，│"flexGrow"，│"flexShrink"，│"flexBasis"，│"aspectRatio"，│"zIndex"，│"方向"，│"shadowColor"，│"shadowOffset"，│"shadowOpacity"，│"shadowRadius"，│"转换"，│"transformMatrix"，│"分解矩阵"，│"scaleX"，│"scaleY"，│"旋转"，│"translateX"，│"translateY"，│"resizeMode"，│"backfaceVisibility"，│"backgroundColor"，│"borderColor"，│"borderRadius"，│"溢出"，│"tintColor"，│"不透明性"，│"overlayColor"，│"borderTopLeftRadius"，│"borderTopRightRadius"，│"borderBottomLeftRadius"，│"borderBottomRightRadius"│ ]│在图像中(位于Image.js:62(│在图像中(在withTheme.js:40(│在ThemedComponent中(位于withTheme.js:57(│在ForwardRef(Themed.Image(中(位于Card.js:78(│在RCTView中(位于Card.js:77(│在RCTView中(位于Card.js:42(│在RCTView中(位于Card.js:34(│in Card(位于withTheme.js:42(│在主题卡中(ConfirmedCardComponent.js:27(│在ConfirmedCardComponent中(位于App.js:24(│在RCTView中(位于ScrollView.js:1063(│在RCTScrollView中(位于ScrollView.js:1196(│在ScrollView中(位于App.js:23(│在RCTView中(位于SafeAreaView.js:41(│在ForwardRef(SafeAreaView(中(位于App.js:22(│在ThemeProvider中(在App.js:20(│在应用程序中(位于renderApplication.js:45(│在RCTView中(位于AppContainer.js:109(│在RCTView中(位于AppContainer.js:135(└在AppContainer中(位于renderApplication.js:39(

Answer 1

试试这个：

import HealthyImage from '../../Assets/healthy.jpeg';
return (
<Fragment>
<Card
title='HELLO WORLD'
image={HealthyImage}>
<Text style={{marginBottom: 10}}>
The idea with React Native Elements is more about component structure than actual design.
</Text>
</Card>
</Fragment>
);

Answer 2

尝试以这种方式实现卡(来自官方的react原生元素文档(：

<Card>
<Card.Title>HELLO WORLD</Card.Title>
<Card.Divider/>
<Card.Image source={require('../images/pic2.jpg')}>
<Text style={{marginBottom: 10}}>
The idea with React Native Elements is more about component structure than actual design.
</Text>
</Card.Image>
</Card>