# scroll 滾動加載

### js

import _ from "lodash";

mounted() {
    this.$refs.mainDiv.addEventListener(
      "scroll",
      _.debounce(this.scrollFun, 300, {
        trailing: true
      })
    );
}

methods:{
    changePage() {
        //do something
    },
    scrollFun(e) {
      const offset = 20;
      const scrollMax = e.target.scrollHeight - e.target.clientHeight; // 滾到底的數字最大值
      const scrollCurrent = e.target.scrollTop; // 現在滾到哪裡
      scrollCurrent > scrollMax - offset && this.changePage();
    }
}

<div class="main-content" ref="mainDiv"></div>

### css

.main-content {
  overflow-y: scroll;
}