在react中引入下拉刷新和上拉加载

1. 首先引入插件 import ReactPullLoad, {STATS} from 'react-pullload'

2. 初始化：

       constructor(props) {
           super(props);
        this.state = {
                        action: STATS.init,
                hasMore: true,
                isMore:1,
                    page:1
                
        }

3. // 用来触发加载和刷新的函数

handleAction = (action) => {
        console.info(action, this.state.action, action === this.state.action);
        //new action must do not equel to old action
        if(action === this.state.action) {
                return false
        }

        if(action === STATS.refreshing) { //刷新
                this.handRefreshing();

        } else if(action === STATS.loading) { //加载更多
                this.handLoadMore();
        } else {
                //DO NOT modify below code
                this.setState({
                        action: action
                })
        }
}
//刷新
handRefreshing = () => {
        if(STATS.refreshing === this.state.action) {
                return false
        }
        setTimeout(() => {
                //refreshing complete
                this.setState({
                        hasMore: true,
                        action: STATS.refreshed
                });
        }, 2000)
        this.setState({
                action: STATS.refreshing
        })
}
//加载更多
handLoadMore = () => {
        if(STATS.loading === this.state.action) {
                return false
        }
        setTimeout(() => {
                if(this.state.isMore === 0) {
                        this.setState({
                                action: STATS.reset,
                                hasMore: false
                        });
                } else {
                        var n=this.state.page;
                                n++;
                                $.ajax({
                                        type: "POST",
                                        url:httphead+"/author/goods/getList",
                                        data:{
                                                page:n,
                                                end:10,
                                                cateIds:catAllId,
                                                keyword:this.state.value
                                        },
                                        headers:{
                                                Authorization:headers_vendor
                                        },
                                        success:function(data){
                                                
                                                if(data.code == 100){
                                                        var nData = this.state.goodList.concat(data.data.goodsList);
                                                        this.setState({
                                                                goodList:nData,
                                                                action: STATS.reset,
                                                                isMore:data.data.isMore,
                                                                page:n
                                                        })
                                                }else if(data.code == 500){
                                                        window.location.href = "/";
                                                }else{
                                                        alert(data.message);
                                                }
                                        }.bind(this)
                                })
                }
        }, 500)

        this.setState({
                action: STATS.loading
        })
}