Как оставаться на том же месте при скроллинге при добавлении элементов в Vue?

Question

[Игорь Безлепкин]

Друзья! Подскажите! Делаю типа мессенджер, элемент на котором сами сообщения скроллится. Так вот при добавлении элементов через vuex позиция как бы сбивается. то есть типа находишься на конкретном сообщении, как только элементы добавились в начала массива, скроллинг улетает на другую позицию.
может какой хак есть :)

Comments

[shmatuan]

jsfiddle.net/GRnQY/5 мб так может?

Answer 1

[0xD34F]

Сохраняйте значение scrollHeight. И делайте watch на массив элементов - в обработчике вычисляйте разницу между старым и новым значениями scrollHeight, корректируйте соответствующим образом scrollTop. Как-то так.

Answer 2

[Эдуард Фабер]

Данные из vuex через computed проброшены, верно? Добавить watch на эту переменную, там уже высчитывать высоту добавленного элемента ($nextTick я думаю), и изменять scrollTop

Answer 3

[Игорь Безлепкин]

Вообщем поигравшись, пришел к выводу, что когда элементы добавляешь в DOM по старинке, ParentNode.prepend()
то все норм. Но теперь проблема такая. Хочу как в mustache.js взять шаблон, запихнуть переменные (в цикле) и сделать prepend в DOM.
Можно как нибудь сделать так в Vue?