实现后台获取数据,每次滚动到底部获取一次;将数组的元素拆出来然后push到新的数组里面
将昨天写的get请求封装成一个函数,放在methods中
get:function(){
const that = this;
request
.get('http://r')//api接口
.query({name:''})
.query({pageNumber:that.pageNo})
.query({sort:1})
.query({type:1})
// .send({name:'',pageNumber:0,sort:1,type:1})//需要传给后台的数据
//.set('X-API-Key', 'foobar')
.set('Accept', 'application/json')//用来告诉服务端消息主体是序列化后的 JSON 字符
.end(function(err, res){
if (err || !res.ok) {
alert('Oh no! error');
} else{
// console.log(res.body.data.materialList);
for(let i = 0;i<res.body.data.materialList.length;i++){
that.emailMaterial.push(res.body.data.materialList[i])
}
console.log(res.body.data);
// that.emailMaterial=res.body.data.materialList;
// console.log(res.body.data.materialList.id);
// alert('yay got ' + JSON.stringify(res.body));
}
});
},
这里面涉及到的传给后台参数的问题;,,这是get中用的,一般post中用send,还有一中是attach,是用于文件或者是formData,上传下载这样。
这一部分是将获取的数组拆分出来,push到自己定义的数组中,在这样每次调用的get()请求额数据都会push到数组里面。
在传给后台的pageNumber是动态变化的,这样我们就把这个变化值写在动事件里面
滚动事件我写在created函数下面
created(){
// console.log(request);
//调用素材列表superagent请求
this.get();
// 滚动加载更多
const self = this;
$(window).scroll(function(){
let scrollTop = $(this).scrollTop();
let scrollHeight = $(document).height();
let windowHeight = $(this).height();
if(scrollTop+windowHeight === scrollHeight){
// alert(123);
// console.log(self);
self.get();//滚动条到底部的时候,调用一次get()
self.pageNo++;//每次调用的时候,自定义的pageNo+1,pageNo是自己在data重定义的初始值
console.log(self.pageNo);
// console.log(self.get())
}
})
},