0

I need to simulate book pages with text. Let's say I have a paragraph that if does not fit into the first page (div), the text overflowed, needs to continue in another one. I found this solution in jquery, but I find it quite difficult to implement in react (Continuing overflowed text in a different div?) specially because of multiple renders need to simulate the text inside of a div. Can you please suggest a different approach to accomplish this? Is there maybe some npm package that does this already?

Flezcano
  • 1,647
  • 5
  • 22
  • 39
  • I guess you can use the Refs in React to get the DOM access and see what jQuery does with the solution that you already have and see if you can implement. Have you got the jQuery version? As long as you don't modify the DOM, that works with React. – Praveen Kumar Purushothaman Dec 06 '21 at 13:42
  • Sounds good, but how could I simulate that without the user noticing multiple renders while calculating how much text needs to go to other div? – Flezcano Dec 06 '21 at 13:44
  • Ah, that's the pain with React... Good catch... Let me think about it. Wait, what about Memoization? – Praveen Kumar Purushothaman Dec 06 '21 at 13:44
  • sounds interesting, how can I use Memoization to avoid this multiple render problems? – Flezcano Dec 06 '21 at 13:52
  • 1
    Found these two awesome articles: [Use `React.memo()` wisely](https://dmitripavlutin.com/use-react-memo-wisely/) and [One simple trick to optimize React re-renders](https://kentcdodds.com/blog/optimize-react-re-renders). I hope these help... – Praveen Kumar Purushothaman Dec 06 '21 at 14:30
  • 1
    Thanks! I will check – Flezcano Dec 06 '21 at 15:22

0 Answers0