Vue.js 2 может получить положение прокрутки тела, но не установить положение прокрутки тела

1

У меня есть приложение 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

Но безрезультатно, страница не будет прокручиваться. Я также пробовал различные элементы на странице, ни одна из них не прокручивается.

Теги:
vue.js

1 ответ

0
Лучший ответ

UGH. Я нашел решение. По-видимому, хотя класс, который фиксировал мое тело, удалялся, когда модальный был закрыт, он не удалялся достаточно быстро. Я решил это, введя тайм-аут:

setTimeout(() => {
        el.scrollTop = this.bposition
      }, 500)

UPDATE: несколько быстрее, я нашел функцию (во внешнем коде), которая удаляет класс и дублирует его перед моим вызовом, который работает еще лучше:

  var el = document.querySelector('body')
  el.classList.remove('with-modal')
  el.scrollTop = this.bposition

Ещё вопросы

Сообщество Overcoder
Наверх
Меню