zoltantothcom / react-clamp-lines

Responsive clamping component with Read more/Read less buttons built for React.
The Unlicense
146 stars 36 forks source link

clamping doesnt respect newlines #36

Open doug31415 opened 4 years ago

doug31415 commented 4 years ago

STR:

const text = '1\n 1\n  1\n  1\n  1\n  1\n  1\n  1\n  1\n  1\n  1\n  1\n  1\n  1\n  1\n  1\n '
<ClampLines
          className={this.state.cssClasses}
          text={this.text}
        />
JavierPDev commented 4 years ago

To add some more detail to this, it seems to work properly for me on the initial mount, but when the text prop changes, it doesn't. I was lucky in circumstances that allowed me to realize that tidbit, I hope it helps. Might be something with componentDidUpdate vs. componentDidMount.

For now I'm getting around this issue by passing a new key prop (eg. key={Date.now()} on each render of the parent component (since a key prop change forces remount instead of just a normal update on all react components).