我正在尝试将 onscroll 事件处理程序添加到特定的 dom 元素。看看这段代码:
class ScrollingApp extends React.Component {
...
_handleScroll(ev) {
console.log("Scrolling!");
}
componentDidMount() {
this.refs.list.addEventListener('scroll', this._handleScroll);
}
componentWillUnmount() {
this.refs.list.removeEventListener('scroll', this._handleScroll);
}
render() {
return (
<div ref="list">
{
this.props.items.map( (item) => {
return (<Item item={item} />);
})
}
</div>
);
}
}
代码很简单,正如你所看到的,我想处理 div#list 滚动。当我运行这个例子时,它不起作用。所以我尝试直接在渲染方法上绑定 this._handleScroll ,它也不起作用。
<div ref="list" onScroll={this._handleScroll.bind(this)> ... </div>
所以我打开了 chrome 检查器,直接添加了 onscroll 事件:
document.getElementById('#list').addEventListener('scroll', ...);
它正在工作!我不知道为什么会发生这种情况。这是 React 的错误还是什么?还是我错过了什么?任何设备都会非常感激。