ReactNative 之 Text 组件 LineHeight 问题

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

For Existing Member Sign In

› React

This topic created in 2971 days ago, the information mentioned may be changed or developed.

Text 组件 lineHeight 与 height 相等，一般来讲，text 组件字体应该垂直居中，但是我这里却是字体底部对齐 text 组件。

添加 lineHeight 之前效果如下

添加 lineHeight 之后效果如下

代码如下

  <View style={styles.container}>
    <Text style={styles.welcome}>
    Welcome to React Native!
    </Text>
  </View>
      
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  },
  welcome: {
    fontSize: 20,
    textAlign: 'center',
    margin: 10,
    height: 60,
    // lineHeight: 60,
    backgroundColor: 'green',
  }

请教一下为什么会出现这种现象？

1 replies • 2018-03-15 14:14:04 +08:00

aiyov

Mar 15, 2018

已解决，rn 版本问题，0.51 及以下都存在这个问题。