Add a 'Read More' and optionally a 'Read Less' button to text that exceeds a given number of lines
npm install react-native-read-more-text```
npm i react-native-read-more-text --save
or with yarn
``
yarn add react-native-read-more-textProps
| Prop | Type | Required | Note |
|---|---|---|---|
| onReady | function | no | callback function to know when the component is readychildren
| | string | yes | String to render on read more componentrenderTruncatedFooter
| | function | no | function that will replace the Read more labelrenderRevealedFooter
| | function | no | function that will replace the Hide label
`javascript
import * as React from 'react';
import { View, Text } from 'react-native';
import ReadMore from 'react-native-read-more-text';
export class DescriptionCard extends React.Component {
render() {
let { text } = this.props;
return (
Description
renderTruncatedFooter={this._renderTruncatedFooter}
renderRevealedFooter={this._renderRevealedFooter}
onReady={this._handleTextReady}>
{text}
);
}
_renderTruncatedFooter = (handlePress) => {
return (
Read more
);
}
_renderRevealedFooter = (handlePress) => {
return (
Show less
);
}
_handleTextReady = () => {
// ...
}
}
``