uniapp之页面优化,下拉刷新

//列表数据加上 concat 可以整合了 list 的数据
this.tableData = this.tableData.concat(res.rows) 

 

data

scrollTop : 0,

 

//方法。

onPageScroll(e) {
              this.scrollTop = e.scrollTop;
            },
//下拉刷新
            onPullDownRefresh() {
                this.query.pageNum = 1
                this.query.pageSize = 10
                this.adminList()
                uni.stopPullDownRefresh()
            },
//加载下一页数据
            onReachBottom() {
                ++this.query.pageNum //这里要换成你自己的 query
                this.adminList() //调用列表数据

                               // 判断列表返回的总数 是否 大于 列表数据
                if (this.total <= this.tableData.length) {
                  setTimeout(() => {
                    this.$refs.uToast.show({
                      title: '没有数据啦',
                      type: 'success',
                    })
                  }, 300)
                }
            },    

 

返回顶部

<u-toast ref="uToast" /> //这个是页面打印输出的
        
        <!-- 返回顶部 -->
        <view class="wrap">
           <u-back-top :scroll-top="scrollTop" :bottom="50"></u-back-top>
        </view>

判断列表是否有数据

<u-empty text="暂无数据" mode="tableData"  v-if="tableData.length == 0" ></u-empty>

 

posted @ 2022-06-08 10:34  薛定谔_猫  阅读(564)  评论(0)    收藏  举报