@caseykey/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
8
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"} |