vue怎么监听某个 div的滚轮

vue怎么监听某个 div的滚轮事件,哪位大虾指点一下!

回答:

封装在组件中 如下:

<template>
  <div class="scroll">
    <div class="scroll-div-outer" id='scrollDiv'>
      <div class="scroll-div-inner">
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'scroll',
  methods:{
    checkDivScroolTop(){
      //获取节点
      var scrollDiv = document.getElementById('scrollDiv');
      //绑定事件
      scrollDiv.addEventListener('scroll', function() {
        console.log(scrollDiv.scrollTop);
      });
    }
  },
  mounted(){
    this.checkDivScroolTop();
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
  .scroll-div-outer{
    height: 200px;
    width: 200px;
    border: 1px solid #ccc;
    overflow: auto;
  }

   .scroll-div-inner{
    height: 600px;
    width: 200px;
    border: 1px solid #ccc;
  }
</style>

回答:

额,知道了, v-on:scroll

回答:

可以用ref来获取这个节点,然后绑定addeventlistener来添加监听器,或者在div通过事件来监听v-on…….

回答:

mounted中监听,比如window.addEventListener(‘scroll’, this.handleScroll);
然后beforeDestroy时候解除监听
window.removeEventListener(“scroll”, this.handleScroll)

回答:

clipboard.png

clipboard.png

暂无评论

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注