react有什么好的滚动加载插件,求大佬指点

#1

内容如标题,帖子要6个字才能发

#2

都没人么:rofl:,开始慌了,是不是这问题太低级了

#3

哈哈 很多的
antd mobile https://antd-mobile.gitee.io/components/list-view-cn/
react-window https://www.npmjs.com/package/react-window

#4

自己写一个吧,可以给你个参考代码:

import React, {Component} from ‘react’;
import ‘./LoadMore.scss’;

class LoadMore extends Component {
constructor(props) {
super(props);
this.timerId = null;
}

hasScrollbar() {
    return document.body.scrollHeight > (window.innerHeight || document.documentElement.clientHeight);
}

componentDidMount() {
    const {loadMoreFn} = this.props;

    //长屏手机一页未撑满时,自动加载第二页
    if (!this.hasScrollbar()) {
        loadMoreFn();
    }

    const callback = () => {
        const wrapper = this.refs.wrapper;
        const top = wrapper && wrapper.getBoundingClientRect().top;
        const windowHeight = window.screen.height;

        if (top && top < windowHeight) {
            wrapper && loadMoreFn();
        }
    }

    //滚动事件
    window.addEventListener('scroll', () => {
        if (this.props.isLoadingMore) {
            return;
        }

        if (this.timerId) {
            clearTimeout(this.timerId);
            this.timerId = null;
        }

        this.timerId = setTimeout(callback, 50);
    }, false);
}

componentWillUnmount() {
    window.removeEventListener('scroll', null, false);
    this.timerId = null;
}

render() {
    return (
        <div className='loadMore' ref='wrapper'>
            {
                this.props.isLoadingMore &&
                <img src={require('../../../static/img/common/ic/spinner.png')} alt=""/>
            }
        </div>
    )
}

}

export default LoadMore;

#5

perfect-scrollbar插件,感觉还不错,可以了解一下。