<View style={{ flexDirection: 'row', }} >
    <Image size={28} uri={'https://bin.zmide.com/wp-content/uploads/2019/06/2019060622451246-150x150.png'} />
    <Text style={{ justifyContent: 'center', alignItems: 'center', textAlign: 'center', backgroundColor: '#666' }} >好傻好天真…</Text>
</View>

本来预想的效果是文字居中显示,神奇的发现它居然只水平居中了,垂直就没居中…

React Native 之 Text 居中显示-天真的小窝

网上的做法是 Text 组件外边包一层 View ,且 Text 组件的样式除了 fontSize 键值其它样式键值都移到外层 View 的样式中 如下代码实现:

<View style={{ justifyContent: 'center', alignItems: 'center', textAlign: 'center', backgroundColor: '#666' }} >
    <Text>好傻好天真…</Text>
</View>

React Native 之 Text 居中显示-天真的小窝

这样是能解决问题的,不过这样如过过多会不会可能影响性能之类的…