下面的代码使用DataTable.Cell.
如果文本大于列宽,则会隐藏文本
如果大于列宽的文本需要在下一行中中断文本,请帮助需要显示文本。
<DataTable.Row
style={{ flex: 1, flexWrap: 'wrap', paddingLeft: 1, borderColor: 'green', borderWidth: 2 }}>
<DataTable.Cell
style={{
flex: 3,
flexWrap: 'wrap',
borderColor: 'yellow',
borderWidth: 2,
height: auto,
overflow: 'visible',
}}>
<View style={styles.rowbox}>
<Text style={styles.stnname}>Test 1</Text>
<Text>Day:1</Text>
<Text>Distance:0</Text>
</View>
</DataTable.Cell>
<DataTable.Cell numeric>Cell 1 2</DataTable.Cell>
<DataTable.Cell numeric>Cell 1 3</DataTable.Cell>
</DataTable.Row>
<DataTable.Row
style={{ flex: 1, flexWrap: 'wrap', paddingLeft: 1, borderColor: 'green', borderWidth: 2 }}>
<DataTable.Cell
style={{
flex: 3,
flexWrap: 'wrap',
borderColor: 'yellow',
borderWidth: 2,
height: auto,
overflow: 'visible',
}}>
<View …Run Code Online (Sandbox Code Playgroud)