1
订单是flex中的一个有用属性。反应原生:“订单”不是有效的样式属性
我在网上搜索这个。
摘要 CSS订单属性指定用于在其flex容器中放置flex项目的顺序。元素按订单价值的升序排列。具有相同顺序值的元素按其在源代码中的显示顺序排列。
<View style={{display:'flex'}}>
{ item.cover ? <Image style={[styles.item, styles.newsItem]} source={{uri:item.cover}}/> : null }
{ item.title ? <Text numberOfLines={1} ellipsizeMode='tail' style={styles.newsTTopTitle} source={{uri:item.cover}}>{item.title}</Text> : null }
{ item.description ? <Text numberOfLines={1} ellipsizeMode="tail" style={styles.newsTSubTitle} source={{uri:item.cover}}>{item.description}</Text> : null }
</View>
</TouchableOpacity>
newsTSubTitle: {
fontSize:10,
lineHeight:13,
color:'#9B9B9B',
width:233,
textAlign:'left',
alignSelf:'flex-end',
order:2,
},
newsTTopTitle: {
fontSize:12,
lineHeight:15,
color:'#000000',
width:233,
textAlign:'left',
alignSelf:'flex-end',
order:1,
},
我的编码器是像上面,其结果,误差显示。
还有一件事。 item.cover
有时没有价值。然后Text
将布局在父视图的顶部。我想在父视图的底部设置Text
组件。我应该在这种情况下放置占位符图像吗?