Question

我有类似的东西

<View>
  <Text>By clicking this I accept </Text>
  <TouchableHighlight>
    <Text>Terms and Conditions, </Text>
  </TouchableHighlight>
  <TouchableHighlight>
    <Text>Privacy Policy</Text>
  </TouchableHighlight>
</View>

它看起来像这个

By clicking this I accept 
Terms and Conditions
Privacy Policy

或如果我连续显示它（|显示屏幕的边框）

|                                        |          
| By clicking this I accept Terms and Con|ditions, Privacy Policy
|                                        |

我希望它看起来像

|                                       | 
| By clicking this I accept Terms and   |
| Conditions, Privacy Policy            |

我的意思是，如果一个单词不适合屏幕，则将其放入下一行。就像一个多行文字，但有多个文本和可触摸的亮点。这甚至可能吗？

Answer 1

尝试这样的事情。

<Text>
    <Text>By clicking this I accept </Text>
    <Text onPress={() => console.log('terms pressed')} style={{color: 'red'}}>Terms and Conditions</Text>
    <Text>,</Text>
    <Text onPress={() => console.log('privacy pressed')} style={{color: 'red'}}>Privacy Policy</Text>
</Text>

只需将console.log替换为您希望处理点击的任何功能。

Answer 2

const { width, height } = Dimensions.get("window");
<View style={{width:width}}>
//your code
</View>

Answer 3

您可以设置样式：

{{1}}

在React-native中，如何制作多个文本的多行？

3 个答案: