Vue.jsでのスクロール感知

スクロール位置を判定したパーツの表示に利用。
下記ソースではスクロール値が200pxに達すると、divに対して「isVue」クラスを付与。
handleScroll()でwindow.scrollYを指定すると、横スクロールが取得できる。

◆hrml

<div v-bind:class="{ isView: isView }">

◆vue

new Vue({
  el: '#app',
  data() {
      return {
        isView: false
  }
  },
  mounted() {
      window.addEventListener('scroll', this.handleScroll);
  },
  methods: {
      handleScroll() {
        if (window.scrollY > 200) {
          this.isView = true;
        } else {
          this.isView = false;
        }
      }
  }
})

参考サイト

Qiita

Vue.jsでスクロールを検知する

https://qiita.com/SatoTakumi/items/d88df8afae82c53d2d2a