react-read-more-read-less
v1.0.7
Published
Highly customizable React component that displays truncated text with "read more" and "read" less links
Downloads
5,977
Maintainers
Readme
React Read More Read Less
Install
npm install react-read-more-read-less --save
Usage
import ReactReadMoreReadLess from "react-read-more-read-less";
class myComponent extends Component {
render() {
return (
<ReactReadMoreReadLess
charLimit={200}
readMoreText={"Read more ▼"}
readLessText={"Read less ▲"}
>
{myLongText}
</ReactReadMoreReadLess>
);
}
}
PROPTYPES
| Prop | Type | Default | | ---- | ---- | ------- | | charLimit | integer | 150 | | ellipsis | String | … | | readMoreText | String | Read more | | readLessText | String | Read less | | readMoreClassName | String | react-read-more-read-less react-read-more-read-less-more | | readLessClassName | String | react-read-more-read-less react-read-more-read-less-less | | readMoreStyle | object | {whiteSpace: "nowrap", textDecoration: "none"} | | readLessStyle | object | {whiteSpace: "nowrap", textDecoration: "none"} |