内联元素实现

Question

我想创建Text组件并将它们连续显示,就像spanhtml中的元素一样.如果我这样做:

<View>
  <Text> Start here, </Text> <Text> finish here </Text>
</View>

他们之间的线断了,它看起来像:

从这里开始,
到此为止

如何防止断线并将它们显示在同一条线上？

Answer 1

只需设置正确flexDirection.默认是column.

<View style={{flexDirection: 'row'}}>
 <Text> Start here, </Text> <Text> finish here </Text>
</View>

Answer 2

Text使用另一个Text元素包装它们时,组件是内联的,如:

<Text>
   <Text>We</Text><Text>Are</Text><Text>Inline</Text>
</Text>