用vue框架制作触底查询功能的方法及代码是什么-群英

上一篇：用JS怎样编写一个完整的贪吃蛇吃草莓游戏下一篇：用JS怎样搭建别踩白板游戏，实现思路及方法是什么

这篇文章将为大家详细讲解有关“用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;
        }
      });
    },

这篇关于“用vue框架制作触底查询功能的方法及代码是什么”的文章就介绍到这了,更多相关的内容，欢迎关注群英网络，小编将为大家输出更多高质量的实用文章！