反应本机文本退出容器

Question

我在这样的视图容器中有文字

<View
  style={{
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
    borderColor: 'grey'
  }}
>
  <Text>Long Text Here</Text>
</View>

我的结果是这样的

如果我添加<Text numberOfLines={4}>，效果很好，但是我希望文本完全适合视图，如果文本超出范围，它将显示三个点。我不确定多少行就足够了，因为不同的屏幕尺寸会有所不同。

Answer 1

使容器可滚动，然后数据将保留在容器内。使用

<ScrollView>
 // data
</ScrollView>

Answer 2

您可以在<Text>中使用它，

numberOfLines={10}  // obviously whatever no. of lines you want
ellipsizeMode="tail"

这将在超出行数时放置...