1、通过接口获取数据
data: {
current:'', 当前页
page:'', 总页
act:'',
booklist:'' 列表
},
onLoad: function (options) {
let onself=this;
//获取用户缓存
let id=wx.getStorageSync('id');
wx.request({
url: 'http://www.wty.com/api/lists',
method:'POST',
head:{
token:token
},
dataType:'json',
success(res){
if(res.data.code==200){
onself.setData({
booklist:res.data.data.data,
current:res.data.data.current_page,
page:res.data.data.last_page
})
console.log(onself.data.arr);
}
}
})
},
2、书写前端页面 felx 布局 自己写去吧
3、 下拉刷新
在该文件json中 开启
{
"usingComponents": {},
"enablePullDownRefresh": true
}
(1)清除缓存
clearCache:function(){
this.data.current=0;
this.setData({
booklist:[]
})
},
(2) 页面相关事件处理函数--监听用户下拉动作
onPullDownRefresh: function () {
//清楚缓存
this.clearCache();
//获取数据
this.onLoad();
},
4、上拉加载 触底及友好提示
(1)页面上拉触底事件的处理函数
onReachBottom: function () {
//获取缓存
let onself=this;
let current=onself.data.current+1;
if(current>onself.data.page){
wx.showToast({
title: '我是有底线的',
icon:'none',
duration:2000
})
return false;
}
let id=wx.getStorageSync('id');
wx.request({
url: 'http://www.wty.com/api/lists',
method:'POST',
head:{
token:token
},
data:{
page:dang
},
dataType:'json',
success(res){
if(res.data.code==200){
let booklist=res.data.data.data;
booklist.forEach(
function(v,k){
onself.data.booklist.push(v);
}
);
onself.setData({
booklist:onself.data.booklist,
current:current
})
}
}
})
},