RN-ExpandableText is an component of React Native, all the usages of ExpandableText is the same as the native Text component, but it will collapse text when its content exceeds specified number of lines.
npm install rn-expandable-text --save
import ExpandableText from 'rn-expandable-text'
<ExpandableText
numberOfLines={10}
style={styles.expandableText}
collapseView={() => null}
expandView={() =>
(<View style={styles.arrow} />)
}
>
{content}
</ExpandableText>| Prop | Description | Default |
|---|---|---|
| numberOfLines | The max number of lines the content will be, the content exceed this value, the expandview will show. | 5 |
| maxHeight | The max height of the content will be shown, the content exceed this value, the expandview will show. | - |
| expandView | A callback function to return expand-view, you can customize the expand-view. when it's null, expand-view will disappear | |
| collapseView | A callback function to return unexpand-view. Usage the same as expandView | |
| onExpand | A callback when the content expands | - |
| onCollapse | A callback when the content collapses | - |
| animationDuration | the duration(ms) of expand or collapse animation | 100 |
| Default View | customize the expand-view |
|---|---|
 |
 |
cd example
react-native run-android
