问题描述
下面代码的目的是将文本放在两列的同一行上,就像一个 html 表。 此 Expo 代码适用于 Android,但左侧和右侧的文本未在 iPhone 上显示。
<Text style={styles.form.title}>Title</Text>
<View style={{ justifyContent: 'center',}}>
<Left style={{paddingRight:200}}>
<Text style={{fontSize:17}}>First row</Text>
<Text style={{fontSize:17}}>Second row</Text>
</Left>
<Right style={{paddingLeft:150,marginBottom:230}}>
<Text style={{fontSize:17}}>First row</Text>
<Text style={{fontSize:17}}>Second row</Text>
</Right>
</View>
解决方法
您为 Left 和 Right 组件使用什么包?可能那个包与IOS不兼容。
你可以试试这个。我只使用 react-native 组件
<View style={{flex: 1}}>
<Text style={styles.form.title}>Title</Text>
<View style={{ flexDirection: 'row',flex: 1 }}>
<View style={{paddingLeft:200,flex: 1}}>
<Text style={{fontSize:17}}>First row</Text>
<Text style={{fontSize:17}}>Second row</Text>
</View>
<View style={{paddingRight:150,flex: 1}}>
<Text style={{fontSize:17}}>First row</Text>
<Text style={{fontSize:17}}>Second row</Text>
</View>
</View>
</View>
您也可以添加 backgroundColor 只是为了清楚地查看视图。尽量不要依赖包,因为其中一些不是在所有操作系统和博览会上都兼容。