bindscrolltolower="lower" 分页加载
bindrefresherrefresh="fresh" 下拉刷新
refresher-enabled="true" 开启自定义下拉刷新
refresher-triggered="{{triggered}}" 设置当前下拉刷新状态，true 表示下拉刷新已经被触发，false 表示下拉刷新未被触发，是动态控制的（开始的时候不知道，定义了其他变量freshOrNot做的控制…后来也没修改反正是）
页面代码示例如下：
.wxml
<scroll-view class="slideContent"
style="height:{{carsHeight}}rpx"
scroll-y="true"
bindscrolltolower="lower"
bindrefresherrefresh="fresh"
refresher-enabled="true"
refresher-triggered="{{triggered}}">
----放置请求信息----
</scroll-view>.js文件
因图片是其他接口返回，没有同人员列表一起返回，所以做的promise，没有可以忽略。
Page({
/**
* 页面的初始数据
*/
data: {
carsHeight: 0, //列表滚动区高度
drivers: [], //列表数据
keyWord: '', //模糊查询
pageNum: 1, //初始页数
pageSize: 10, //初始条数
stopLoadMoreTiem: false, //阻止多次触发上拉刷新需要的变量（是否分页）
triggered: true, //是否开始自定义下拉刷新（）
freshOrNot: 1, //当分页和下拉加载一同进行时，是否允许下拉加载 1默认下拉可加载，0不可加载
addDriversOrNot: 1, //当分页和下拉加载一同进行时，是否允许数据累加 1累加 0不累加
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady() {
//获取视口高度
let that = this;
({
success: function (res) {
// 获取可使用窗口宽度
let clientHeight = ;
// 获取可使用窗口高度
let clientWidth = ;
// 算出比例
let ratio = 750 / clientWidth;
// 算出高度(单位rpx) - 固定元素的高度滚动区高度
let carsHeight = clientHeight * ratio - 78 - 60;
({
carsHeight: carsHeight,
})
}
});
//页面初始数据
()
},
//处理子组件获取的值，返回给办公车申请页
manChoise(e) {
let pages = getCurrentPages();
let prevPage = pages[ - 2]; //上一个页面
//直接调用上一个页面的setData()方法，把数据存到上一个页面中去
({
'': ,
'': ,
'':
})
({ //返回
delta: 1
})
},
//模糊查询
searchValue: (function (e) {
(, '模糊查询')
({
keyWord: ,
pageNum: 1,
pageSize: 10,
drivers: [],
addDriversOrNot: 0
})
//调用接口
()
}),
//查询人员接口
getSelectIdleDrivers() {
let that = this
({
stopLoadMoreTiem: true
})
let data = {
keyWord: ,
pageNum: ,
pageSize:
}
let driverList;
let reqState;
//请求人员列表
const promiseOne = () => {
return getSelectIdleDrivers(data)
}
promiseOne()
.then(res => {
//数据少于10条时，即请求到了最后一页
driverList = ;
if ( < 10) {
//记录请求状态，把reqState传值给flag
reqState = false;
} else {
reqState = true;
}
//为下一页的请求参数做准备
let nextPage = + 1;
if ( === 0) {
({
drivers: driverList,
pageNum: nextPage,
stopLoadMoreTiem: reqState
})
}else{
({
drivers: (driverList),
pageNum: nextPage,
stopLoadMoreTiem: reqState
})
}
// 请求人员对应的图片接口，进行存放
const promiseArr = [];
((item) => {
if (!! && !== 0) {
(
getImage()
)
} else {
// 没有图片链接也要给个占位，不然图片就串了
('')
}
})
// 请求图片接口并将图片存入人员列表中
let tempList =
(promiseArr).then((newRes) => {
driverList = ((item, index) => {
((temItem) => {
if ( === ) {
= newRes[index]
}
});
return {
...item,
imgBase: newRes[index]
}
})
({
drivers: tempList,
freshOrNot: 1
})
})
})
},
//上拉加载 是封装的节流函数
lower: (function () {
//分页加载和下拉刷新速度太快时，禁止下拉刷新
({
freshOrNot: 0,
addDriversOrNot: 1
})
//调用请求网络接口 + 数组叠加
();
}),
//自定义下拉刷新
fresh() {
({
pageNum: 1,
pageSize: 10,
keyWord: '',
drivers: [], //刷新时行程列表数据清空
triggered: false,
addDriversOrNot: 0
})
if ( === 1) {
//调接口查询 加不加setTimeout都可以，防止再次异步的。
setTimeout(() => {
()
}, 0)
}
},
})