rn 列表上拉加载下拉刷新

参考

componentDidMount() {

        this.requestData();
    }

    refreshData() {
        this.totalPage = 0;
        this.pageNo = 0;
        this.dataSource = [];

        this.setState({
            isRefresh:true
        },() =>{
            this.requestData()
        })
    }

    requestData() {

        if (this.state.inputText) {

            this.props.searchListRequest({
                page: this.pageNo,
                size: 10,
                name: this.state.inputText,
                tags: this.state.inputText
            })
        } else {

            this.props.queryFindMoreRequest({
                page: this.pageNo,
                size: 10,
                tags: this.props.loginData.tags
            });
        }
    }
render() {

        const {navigation, clubQueryFindMoreState} = this.props;

        if (clubQueryFindMoreState.status === CLUB_QUERY_FIND_MORE_SUCCESS) {

//计算总共多少页,尾部显示没有数据
            this.totalPage = clubQueryFindMoreState.result.total / 10;

//尾部显示和刷新菊花设置
            this.setState({showFoot: this.pageNo > this.totalPage ? 1 : 0,isRefresh:false});

//加载更多的数据拼到后面
            clubQueryFindMoreState.result.data.map((item, index) => {
                this.dataSource.push(item)
            });
            this.props.queryFindMoreEnd();
        } else if (clubQueryFindMoreState.status === CLUB_SEARCH_LIST_SUCCESS) {

            this.totalPage = clubQueryFindMoreState.result.total / 10;
            this.setState({showFoot: this.pageNo > this.totalPage ? 1 : 0,isRefresh:false});

            clubQueryFindMoreState.result.data.map((item, index) => {
                this.dataSource.push(item)
            });
            this.props.searchListEnd();
        } else if (clubQueryFindMoreState.status === CLUB_QUERY_FIND_MORE_ERROR || clubQueryFindMoreState.status === CLUB_SEARCH_LIST_ERROR) {
            console.log('err: ' + clubQueryFindMoreState.message);
        } else {
        }

        return (
 this._onRefresh()}
                            refreshing={this.state.isRefresh}
                            //加载更多
                            onEndReached={this._onEndReached.bind(this)}
                            onEndReachedThreshold={1}
                            ListFooterComponent={this._renderFooter.bind(this)}
                        />
)
}
_onRefresh() {

        this.refreshData()
    }
_onEndReached() {
        //如果是正在加载中或没有更多数据了,则返回
        if (this.state.showFoot != 0) {
            return;
        }
        //如果当前页大于或等于总页数,那就是到最后一页了,返回
        if ((this.pageNo != 1) && (this.pageNo >= this.totalPage)) {
            return;
        } else {
            this.pageNo++;
        }
        //底部显示正在加载更多数据
        this.setState({showFoot: 2});
        //获取数据
        this.requestData()
    }
_renderFooter() {
        if (this.state.showFoot === 1) {
            return (
                
                    
                        没有更多数据了
                    
                
            );
        } else if (this.state.showFoot === 2) {
            return (
                
                    
                    正在加载更多数据...
                
            );
        } else if (this.state.showFoot === 0) {
            return (
                
                    
                
            );
        }
    }

你可能感兴趣的:(rn 列表上拉加载下拉刷新)