Rumah  >  Artikel  >  hujung hadapan web  >  如何实现ReactJS 监听页面滚动事件

如何实现ReactJS 监听页面滚动事件

一个新手
一个新手asal
2017-09-27 09:46:305820semak imbas

需要使用监听页面的滚动事件,折腾了挺久终于实现了,写出来跟大家分享一下。希望有更好的做法也能留言给我,谢谢��

export class Example extends Component{
   scrollHandler = this.handleScroll.bind(this);
    componentDidMount() {
      window.addEventListener('scroll', this.scrollHandler);
    }
     _handleScroll(scrollTop) {
         console.log(scrollTop)         //滚动条距离页面的高度
        }
    }
    handleScroll(event) {
        let scrollTop = event.srcElement.body.scrollTop;        
        this._handleScroll(scrollTop);
    }
}

这里写图片描述

Atas ialah kandungan terperinci 如何实现ReactJS 监听页面滚动事件 . Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn