@asferot

Как перевести этот jQuery синтаксис во Vue?

Как перевести этот jQuery синтаксис во Vue?
$(window).on("scroll", function () {
    var scrolled = $(this).scrollTop();
    if( scrolled > 107 ) {
        $('.content').addClass('scrolled');
    }   
    if( scrolled <= 107 ) {     
        $('.content').removeClass('scrolled');
    }
});
  • Вопрос задан
  • 1685 просмотров
Решения вопроса 1
0xD34F
@0xD34F Куратор тега Vue.js
Добавим в компонент свойство, которое будет содержать в себе текущее значение прокрутки:

data: () => ({
  scroll: 0,
  ...
}),

Чтобы значение было актуальным, будем обновлять его при наступлении соответствующего события:

created() {
  window.addEventListener('scroll', () => this.scroll = window.scrollY);
},

Сделаем вычисляемое свойство, которое будет представлять классы, назначаемые элементу в зависимости от текущего значения прокрутки:

computed: {
  scrollClasses() {
    return что-то, в зависимости от значения this.scroll;
  },
  ...
},

<div :class="scrollClasses"></div>

https://jsfiddle.net/o1hjb79u/
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы