<view class="wrap">
<view class="top"></view>
<view class="content">
<scroll-view scroll-y="true" scroll-top="{{ scrollTop }}" bindscrolltolower="loadMoreData" style="height: 100%;">
....
</scroll-view>
</view>
<view class="bottom"></view>
</view>
<script>
getData() {
const that = this;
if (this.data.lock) {
return
}
wx.showLoading({
title: '加载中',
});
this.setData({
lock: true
})
const res = await app.$get('', {});
wx.hideLoading();
if (res && res.list.length > 0) {
const tableData = that.data.tableData.concat(res.list);
that.setData({
page: currentPage + 1,
hasMore: true,
lock: false
});
} else {
that.setData({
hasMore: false,
lock: false
});
}
}
loadMoreData: function () {
if (!this.data.hasMore) return;
this.getData(this.data.page);
},
</script>
<style>
.wrap{
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
}
.top {
height: 50px;
}
.content {
flex: 1;
overflow-y:scroll;
}
.bottom {
height: 50px;
}
</style>