如何在React Native中模拟"align-items:baseline"？

Question

由于RN的Flexbox实现中没有"align-items:baseline",如何水平对齐两个文本元素的基线？

JSX:

<View style={styles.numberAndPercent}>
  <Text style={styles.number}>6.80</Text>
  <Text style={styles.percent}>%</Text>
</View>

Answer 1

React Native现在支持alignItems: 'baseline',因此以下内容应该有效:

numberAndPercent: {
  flexDirection: 'row',
  alignItems: 'baseline',
}

这里有 Flexbox文档; 此处支持的值的完整列表.