判断某个组件是否滚动到底部
上面方法已经尝试过,目前还是比较好用的。
* 页面切换出去再切换回来后怎样保持之前的滚动位置
要保证这个组件就是那个滚动的组件,overflowY为scroll
判断某个组件是否滚动到底部
- 组件代码如下,通过ref获取真实的dom节点
<div ref='contentNode'> this.refs.contentNode //可以用这个方法获取真实的DOM节点
或者
<div
ref
={ node =>
this
.contentNode = node }>
在组件加载时添加事件
componentDidMount() {
if (this.contentNode) {
this.contentNode.addEventListener('scroll', this.onScrollHandle.bind(this));
}
}
onScrollHandle(event) {
const clientHeight = event.target.clientHeight
const scrollHeight = event.target.scrollHeight
const scrollTop = event.target.scrollTop
const isBottom = (clientHeight + scrollTop === scrollHeight)
console.log('is bottom:' + isBottom)
//当页面滚动到底部时,
isBottom变为true,可以在这个地方继续数据请求,来实现下拉刷新的效果
}
组件将要卸载的时候移除事件
componentWillUnmount() {
if (this.contentNode) {
this.contentNode.removeEventListener('scroll', this.onScrollHandle.bind(this));
}
}
上面方法已经尝试过,目前还是比较好用的。