Vue 节流防抖 滑动变色

lodash中文文档
首先安装

npm i lodash -S

然后main.js引入

import _ from 'lodash'
Vue.use(_)

这样引入 直接就可以用_.throttle不需要加this
touchmove或者scroll都可以

  mounted() {
   window.addEventListener("scroll", _.throttle(this.handleChageColor), true);
  },

写个方法
lengths就是主体 滑动的部分

<section ref="indexs">

 methods: {
    handleChageColor() {
      var lengths = this.$refs.indexs.scrollTop;
      if (lengths > 250) {
        this.backgroundColor = "linear-gradient(to bottom, red, white)";
      } else {
        this.backgroundColor = "transparent";
      }
    },
  },

注意 因为是用window监听 所以可能导致跳页面报错
可以把window换成 这个页面的大盒子
document .querySelector(".home")
就没问题了