一般給當(dāng)前模版設(shè)置監(jiān)聽(tīng)都是這樣寫(xiě)
在 mounted函數(shù)中
window.addEventListener("scroll", this.handleScroll);
然后調(diào)用方法
handleScroll() {
var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
console.log(scrollTop + "scrollTop")
},
這樣就可以實(shí)時(shí)監(jiān)聽(tīng)到滾動(dòng)數(shù)據(jù)
之前一直是可以監(jiān)聽(tīng)到的耐亏，后來(lái)突然發(fā)現(xiàn)不好使了贺归，根本原因就是給body設(shè)置了overflow：scroll屬性，導(dǎo)致了
window.addEventListener("scroll", this.handleScroll);
失效亭引。
此時(shí)的解決辦法是
<template>
<div class="container" id='move' :class="{active:flag}" ref="ct">
</div>
</template>
需要監(jiān)聽(tīng)的組件this.$refs的形式拿到元素的dom節(jié)點(diǎn),代碼如下,在mounted函數(shù)中
this.box = this.$refs.ct
this.box.addEventListener('scroll', () => {
this.handleScroll();
}, false)
然后調(diào)用方法：
handleScroll() {
var scrollTop = this.$refs.ct.scrollTop;
// console.log(scrollTop);
},
此時(shí)便可以完美解決 window.addEventListene ( )失效問(wèn)題
