网络编程
位置:首页>> 网络编程>> JavaScript>> vue实现触底查询功能

vue实现触底查询功能

作者:@洛飞  发布时间:2024-04-30 10:25:01 

标签:vue,触底查询

本文实例为大家分享了vue实现触底查询功能的具体代码,供大家参考,具体内容如下

1.使用vant-list组件相关内容如下:

vue实现触底查询功能

2.对象绑定值的默认值:

vue实现触底查询功能

3.查询方法:

vue实现触底查询功能

完整代码:


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;
       }
     });
   },

来源:https://blog.csdn.net/m0_57891856/article/details/121489460

0
投稿

猜你喜欢

手机版 网络编程 asp之家 www.aspxhome.com