app、小程序下拉刷新上拉加载 - 更新日志

1.0.4（2023-10-10）

修改bug

1.0.3（2023-10-10）

修改bug

1.0.2（2023-10-10）

1.定义变量

data() {
    return {
        list: [],
        status: 'noMore',
        scrollHeight: 500,
        objHeight: {
            h2: '',
            h3: '',
        },
        pagination: {
            page: 1,
            pageSize: 15,
        },
    }
},

2.直接在代码中使用

<chuizi-refresh @scrolltolower="clickLoadMore" @onRefresh="refresh" :pullupLoadingType="status"
                    :scrollHeight="scrollHeight">
            <view class="test" v-for="(item,index) in list" :key="index" >
            .....
            </view>
</chuizi-refresh>

2.设置列表的高度，计算出整体高度，计算出需要抛出的高度，算出列表高度

onReady() {
    const _t = this
    uni.getSystemInfo({
        success: (res) => {
            let allHeight = res.windowHeight

            // const ele2 = uni.createSelectorQuery().select('.hidden-select')

            // ele2.boundingClientRect((data) => {
            //  _t.objHeight.h2 = data.height
            // }).exec()

            _t.scrollHeight = allHeight - 60 

        }
    })
},

3.定义方法

methods: {
    clickLoadMore() {
        if (this.status === 'more') {
            this.status = 'loading'
            setTimeout(() => {
               //去请求数据
            }, 600)
        }
    },

    refresh() {
        this.status = 'more'
        this.pagination.page = 1
        this.list = []
       //去请求数据
    },
    getData(){
            // if (res && res.records && res.records.length) {
            //  this.list = this.pagination.page === 1 ? res.records : this.list.concat(res.records)
            //  if (res.records.length <= 0 || res.records.length < this.pagination.pageSize) {
            //      this.status = 'noMore'
            //  } else {
            //      this.pagination.page++
            //      this.status = (this.pagination.page - 1) >= res.pages ? 'noMore' : 'more'
            //  }
            // } else {
            //  this.list = []
            // }

    }
}

1.0.1（2023-10-10）

1.定义变量

    return {
        list: [],
        status: 'noMore',
        scrollHeight: 500,
        objHeight: {
            h2: '',
            h3: '',
        },
        pagination: {
            page: 1,
            pageSize: 15,
        },
    }
},

2.直接在代码中使用

                    :scrollHeight="scrollHeight">
            <view class="test" v-for="(item,index) in list" :key="index" >
            .....
            </view>
</chuizi-refresh>

2.设置列表的高度，计算出整体高度，计算出需要抛出的高度，算出列表高度

    const _t = this
    uni.getSystemInfo({
        success: (res) => {
            let allHeight = res.windowHeight

            // const ele2 = uni.createSelectorQuery().select('.hidden-select')

            // ele2.boundingClientRect((data) => {
            //  _t.objHeight.h2 = data.height
            // }).exec()

            _t.scrollHeight = allHeight - 60 

        }
    })
},

3.定义方法

    clickLoadMore() {
        if (this.status === 'more') {
            this.status = 'loading'
            setTimeout(() => {
               //去请求数据
            }, 600)
        }
    },

    refresh() {
        this.status = 'more'
        this.pagination.page = 1
        this.list = []
       //去请求数据
    },
    getData(){
            // if (res && res.records && res.records.length) {
            //  this.list = this.pagination.page === 1 ? res.records : this.list.concat(res.records)
            //  if (res.records.length <= 0 || res.records.length < this.pagination.pageSize) {
            //      this.status = 'noMore'
            //  } else {
            //      this.pagination.page++
            //      this.status = (this.pagination.page - 1) >= res.pages ? 'noMore' : 'more'
            //  }
            // } else {
            //  this.list = []
            // }

    }
}```

1.0.0（2023-10-10）

1.定义变量 data() { return { list: [], status: 'noMore', scrollHeight: 500, objHeight: { h2: '', h3: '', }, pagination: { page: 1, pageSize: 15, }, } },

2.直接在代码中使用 <chuizi-refresh @scrolltolower="clickLoadMore" @onRefresh="refresh" :pullupLoadingType="status" :scrollHeight="scrollHeight">

2.设置列表的高度，计算出整体高度，计算出需要抛出的高度，算出列表高度 onReady() { const _t = this uni.getSystemInfo({ success: (res) => { let allHeight = res.windowHeight

        // const ele2 = uni.createSelectorQuery().select('.hidden-select')

        // ele2.boundingClientRect((data) => {
        //  _t.objHeight.h2 = data.height
        // }).exec()

        _t.scrollHeight = allHeight - 60 

    }
})

}, 3.定义方法 methods: { clickLoadMore() { if (this.status === 'more') { this.status = 'loading' setTimeout(() => { //去请求数据 }, 600) } },

refresh() {
    this.status = 'more'
    this.pagination.page = 1
    this.list = []
   //去请求数据
},

getData(){ // if (res && res.records && res.records.length) { // this.list = this.pagination.page === 1 ? res.records : this.list.concat(res.records) // if (res.records.length <= 0 || res.records.length < this.pagination.pageSize) { // this.status = 'noMore' // } else { // this.pagination.page++ // this.status = (this.pagination.page - 1) >= res.pages ? 'noMore' : 'more' // } // } else { // this.list = [] // }

} }