如何为具有4列6行表的数组中的24个元素设置样式?
该数组有24个元素,如下所示:
const words = ["a", "b", "c", "d", "e", "f", "g", "h", "i", "j", "k", "l", "m", "n", "o", "p", "q", "r", "s", "t", "u", "v", "w", "x" ]
我将它们映射到render方法中:
<View>
{words.map((word, id) => (
<View key={id}><Text>{word} </Text></View>
))}
</View>
最佳答案
您可以使用一些简单的flex属性:
const styles = StyleSheet.create({
table: {
flexWrap: 'wrap',
flexDirection: 'row'
},
cell: {
flexBasis: '25%',
flex: 1,
borderWidth: 1
}
});
然后:
<View style={styles.table}>
{words.map((word, id) => (
<View style={styles.cell} key={id}><Text>{word} </Text></View>
))}
</View>
https://snack.expo.io/@morkadosh/mad-salsa
关于javascript - 如何在React Native中将数组中的元素设置为表格样式,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/56582168/