0

I have a long textarea, with 100-200 lines. They corresponds to redux state phrases = [{id, text, ...}], each line of textarea is a phrases[id].text.

<textarea value={_.map(phrases, 'text').join('\n')}></textarea>

When I change textarea, it dispatches change of redux state phrases.

And when I change one letter from first line, page scrolls to end and cursor goes to 200th line. But I want that cursor and scroll position of page doesn't change.

I tried to use event.target.selectionStart, selectionEnd, but even cursor returns on its position, page scrolls to the screen end.

How to fix it?

image for example

Rustam Apay
  • 551
  • 1
  • 4
  • 18
  • 1
    I've created [simple demo](https://codesandbox.io/s/misty-sunset-7w7bn) where value is set randomly by timer. it does not scroll to the end to me. probably you component is recreated instead of being updated(but then it would scroll to top, not to bottom). make some minimal example to reproduce. – skyboyer Dec 29 '19 at 10:37
  • @skyboyer, can you look at my [app](https://frazy.me/material/edit/wTYrWljgxVprZzxQqaQo/ru), and [code](https://github.com/Aparus/frazy/blob/master/src/components/materialForm/MaterialFormPhrases.jsx) please? – Rustam Apay Dec 29 '19 at 18:26
  • hard to say, I edited text in both textareas and page was not scrolled down to me. – skyboyer Dec 29 '19 at 19:09
  • @skyboyer, now I see, it happens only when I add new line. thank you for answer – Rustam Apay Dec 30 '19 at 09:34

0 Answers0