在vue.js中检测滚动

Question

我想在检测到滚动时在vue.js中触发一个函数，或者甚至更好地在滚动超过window％的5％或诸如此类时触发一个函数。 但我做对了。

这是我的代码：

<template>
  <div>
    <Test1 v-on:scroll.passive="handleScroll"></Test1>
  </div>
</template>

<script>
import Test1 from "./Test1";

export default {
  name: "HomePage",
  components: {
    Test1
  },
  methods: {
    handleScroll: function() {
      alert("something");
    }
  }
};
</script>

<style >
</style> 

Answer 1

您可以使用滚动事件并在需要时触发函数

    window.addEventListener('scroll', function(e){
        if(e.pageY>window.innerHeight*0.05){
            console.log('over 5%'); //use your function here
        }
    });

确保在不再需要事件监听器或卸载组件时删除事件监听器