Update it for React 17 & 18

React text collapse

Philosophy

Keep things simple! You don't need jQuery...

Installation

npm

$ npm install --save react-text-collapse

Demo

Example code

Code Example

Usage

<ReactTextCollapse options={TEXT_COLLAPSE_OPTIONS}>
  <p>
    React text collapse is awesome. React text collapse is awesome.
    <br />
    React text collapse is awesome. React text collapse is awesome.
    <br />
    React text collapse is awesome. React text collapse is awesome.
    <br />
    React text collapse is awesome. React text collapse is awesome.
    <br />
  </p>
</ReactTextCollapse>

Options

`options`: PropTypes.object.isRequired

const TEXT_COLLAPSE_OPTIONS = {
  collapse: false, // default state when component rendered
  collapseText: '... show more', // text to show when collapsed
  expandText: 'show less', // text to show when expanded
  minHeight: 100, // component height when closed
  maxHeight: 250, // expanded to
  textStyle: { // pass the css for the collapseText and expandText here
    color: "blue",
    fontSize: "20px"
  }
}

Development

$ git clone [email protected]:cht8687/react-text-collapse.git
$ cd react-text-collapse
$ npm install
$ webpack-dev-server

Then

open http://localhost:8080/webpack-dev-server/

License

MIT

Contributors

Thanks to these wonderful developers for helping this project:

cht8687 / react-text-collapse Goto Github PK

react-text-collapse's Introduction

React text collapse

Philosophy

Installation

npm

Demo

Example code

Usage

Options

options: PropTypes.object.isRequired

Development

License

Contributors

react-text-collapse's People

Contributors

Stargazers

Watchers

Forkers

react-text-collapse's Issues

Recommend Projects

Recommend Topics

Recommend Org

`options`: PropTypes.object.isRequired