vue实现触底查询功能
作者：@洛飞
这篇文章主要为大家详细介绍了vue实现触底查询功能，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
本文实例为大家分享了vue实现触底查询功能的具体代码，供大家参考，具体内容如下
1.使用vant-list组件相关内容如下：
2.对象绑定值的默认值：
3.查询方法：
完整代码：
methods: {
getdata() {
let status=3;
this.queryParams.params={
status:status,
passFactory: this.$store.state.user.werksName
}
let params = JSON.parse(JSON.stringify(this.queryParams));
api.getPageList(params).then((res) => {
if (res.success) {
this.dataList = res.data.content;
} else {
Toast.fail({
message: res.msg
});
}
});
},
onLoad() {//触底查询
this.queryParams.page += 1;
let _this = this;
let status=3;
this.queryParams.params={
status:status,
passFactory: this.$store.state.user.werksName
}
let params = JSON.parse(JSON.stringify(this.queryParams));
api.getPageList(params).then((res) => {
if(res.success){
this.dataList = this.dataList.concat(res.data.content);
if (this.dataList.length >= res.data.totalElements) {
this.finished = true;
} else {
this.finished = false;
}
this.loading = false;
}
});
},
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。