【Vue】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)

【Vue】vue怎么监听某个 div的滚轮

【Vue】vue怎么监听某个 div的滚轮

以上是 【Vue】vue怎么监听某个 div的滚轮 的全部内容, 来源链接: utcz.com/a/74584.html

回到顶部