У меня есть приложение Vue.js, в котором я открываю модальный подход и вам нужно установить тело под ним в фиксированное положение, чтобы предотвратить его прокрутку на мобильном устройстве. Это, конечно, прокручивает его вверх. Перед открытием модальности я получаю позицию прокрутки и устанавливаю ее так:
this.bposition = document.body.scrollTop
console.log(document.body.scrollTop)
И это отлично работает, я могу выводить правильную позицию в моей консоли. Но потом, когда я закрываю свой модальный подход, я пытаюсь это сделать:
console.log(this.bposition) // proves my close function is running and gets the correct value
var el = document.querySelector('body')
el.scrollLeft = 0 // have tried with and without this line
el.scrollTop = this.bposition
Но безрезультатно, страница не будет прокручиваться. Я также пробовал различные элементы на странице, ни одна из них не прокручивается.
UGH. Я нашел решение. По-видимому, хотя класс, который фиксировал мое тело, удалялся, когда модальный был закрыт, он не удалялся достаточно быстро. Я решил это, введя тайм-аут:
setTimeout(() => {
el.scrollTop = this.bposition
}, 500)
UPDATE: несколько быстрее, я нашел функцию (во внешнем коде), которая удаляет класс и дублирует его перед моим вызовом, который работает еще лучше:
var el = document.querySelector('body')
el.classList.remove('with-modal')
el.scrollTop = this.bposition