react native FlatList下拉刷新上拉加载数据,前端分页,无数据计算高度

React Native 版本执行0.57的规则

数据相关的控制

分页的实现,首先规定每页显示几条,也是后台接口的必传参数,如果请求回来的数据大于这个长度就认为还有数据,否则就是到底了没有数据了。

this.state = {
   
            isLoading: false,
            myVipData: [{
    //订单列表tab文案
                tabName: '全部',
                type: ''
            }, {
   
                tabName: '待付款',
                type: 'c010101'
            }, {
   
                tabName: '待发货',
                type: 'c010102'
            }, {
   
                tabName: '待收货',
                type: 'c010103'
            }, {
   
                tabName: '待评价',
                type: 't01',
            }, {
   
                tabName: '退款/售后',
                type: 'c010105'
            }],
            pageNum: 1,// 页码
            pageSize: 10,// 每页条数
            activeIndex: 0, // tab切换默认index
            getorderArr: [], // 我的订单数据
            time: "", //15分钟倒计时dom绑定
            dataFlag: true,// 是否还有下一页
            isRefresh: false,// 加载图标
        }
componentWillMount() {
   
        //接受一级页面数据
        this.setState({
   
            activeIndex: this.props.navigation.state.params.index
        })
    }
    componentDidMount() {
   
        // 调取商品列表方法
        this._getorder(this.state.myVipData[this.state.activeIndex].type, this.state.pageNum)
    }
    componentWillUnmount() {
   
        // this.timer && clearTimeout(this.timer);
    }



_getorder(type, pageNum) {
   
        if (pageNum == 1) {
   
            this.setState({
   
                getorderArr: [],
            })
        }
        this.setState({
   
            isLoading: true,
        })
        Fetch(requestUrl.getorder, {
   
            'userId': UserInfo.id,
            'type': type,
            'pageNum': pageNum,
            'pageSize': this.state.pageSize
        }).then(data => {
   
            if (data.status == 'SUCCESS') {
   
                if (data.data.length >= this.state.pageSize) {
   
                    let tempArr = this.state.getorderArr;
                    tempArr = tempArr.concat(data.data);
                    this.setState({
   
                        dataFlag: true,
                        getorderArr: tempArr,
                        isLoading: false
                    })
                } else {
   
                    let tempArr = 
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值