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

コード

index.html

<div id="app">
  <div class="content">
    <span>{{ scrollY }}</span>
  </div>
</div>

main.js

new Vue({
  el: '#app',
  data: {
    scrollY: 0
  },
  mounted() {
    window.addEventListener('scroll', this.handleScroll);
  },
  methods: {
    handleScroll() {
        this.scrollY = window.scrollY;
    }
  }
})

サンプル:
https://jsfiddle.net/z11fe07p/1088/

解説

window.addEventListener('scroll', this.handleScroll);

ここでイベントをリッスンさせて、

handleScroll() {
  this.scrollY = window.scrollY;
}

この関数を呼び出すだけ。