我正在构建一个应用程序(ES6),我很好奇什么是正确的方法来捕捉向上/向下滚动事件?
我试过(npm)安装react-scroll-listener但我无法使用我的ES6类.
我基本上想要:如果向上滚动,请执行此操作;如果向下滚动,请执行其他操作.
import React from 'react'; import config from '../config'; import StaticImageList from '../Common/StaticImageList'; import ScrollListener from 'react-scroll-listener'; class Album extends React.Component { constructor(props){ super(props); } myScrollStartHandler(){ console.log('Scroll start'); } myScrollEndHandler(){ console.log('Scroll end 300ms(default)'); } componentDidMount(){ scrollListener.addScrollHandler('body',myScrollStartHandler,myScrollEndHandler ); } render(){ return <StaticImageList />; } }; export default Album;
这是挂钩任何听众的一般建议:
原文链接:https://www.f2er.com/react/300690.html在componentDillMount中附加内容,在componentWillUnmount中取消附加
class Whatever extends Component { componentDidMount() { window.addEventListener('scroll',this.handleScroll,{ passive: true }) } componentWillUnmount() { window.removeEventListener('scroll',this.handleScroll) } handleScroll(event) { // do something like call `this.setState` // access window.scrollY etc } }