React Native – wrap Text in a View

November 11, 2023

I have the following code, and I want multiple <Text> in a <View> to become one consecutive paragraph. But when displayed on the App, they appear below the line.
(Because I need to use Tooltip, I need to use multiple <Text> in one <View>)

Source code:

<View style={{flex:1, width:'100%', flexDirection: 'row', flexWrap: 'wrap', padding: 10}}>
  <Text>{'放棄行政工作。'}</Text>
  <Text>{'退守分析預測的。'}</Text>
  <Text>{'把AI當作同事，形成協同合作的團隊。'}</Text>
  <Text>{'多琢磨在創造力以及各種流程架構設計師角色。'}</Text>
  <Text>{'強化自己人際網路、溝通協調、談判上的能力。'}</Text>
</View>

run:

display that I desire:

>Solution :

Embed your text components in a parent Text to make them part of the same line.

<View style={{flex:1, width:'100%', flexDirection: 'row', flexWrap: 'wrap', padding: 10}}>
  <Text>
    <Text>{'放棄行政工作。'}</Text>
    <Text>{'退守分析預測的。'}</Text>
    <Text>{'把AI當作同事，形成協同合作的團隊。'}</Text>
    <Text>{'多琢磨在創造力以及各種流程架構設計師角色。'}</Text>
    <Text>{'強化自己人際網路、溝通協調、談判上的能力。'}</Text>
  </Text>
</View>