时间戳

首页 > 解决方案 > numberOfLines 如何在反应原生 Text 组件中工作？

react-native - numberOfLines 如何在反应原生 Text 组件中工作？

问题描述

正如文档所说：ellipsizemode道具定义了文本将如何被截断。就我而言，我想显示一个展开按钮而不是省略号字形，我可以通过按下按钮展开文本以显示所有这些。

所以我想弄清楚numberOfLinesreact-native 中 Text 组件的实际工作原理。然后我可以存档这个，有人可以帮忙吗？

标签： react-nativetext

解决方案

它将显示您的内容在<Text>适合那些的组件中numberOfLines。

对于您期望或想要执行的输出，您可以使用动态numberOfLinesusing state。

只需拥有该state变量的默认值lineNumbers并在按下按钮或任何其他组件时更改它。

this.state = {
    lineNumbers: 2
}

这表明您的 numberOfLines 将默认为 2，一旦用户按下按钮或阅读更多

this.setState({lineNumbers: null})

它将显示全部内容。

<Text numberOfLines={this.state.lineNumbers}>

推荐阅读