vant list 下拉刷新 上拉加载

上拉加载不生效 经常出bug 大部分是样式高度问题
注意 list van-pull-refresh van-list 的高度

      <div class="list">
        <van-pull-refresh v-model="isRefreshing"
                          @refresh="handleEvent('refresh')">
          <van-list v-model="loading"
                    :offset="100"
                    :finished="finished"
                    finished-text="没有更多了"
                    @load="handleEvent('load')">
            <!-- <div class="list-item" v-for="(item, index) in listData" :key="index"> -->
            <div class="list-item"
                 @click="tohlszy(item)"
                 v-for="(item,index) in listData"
                 :key="index">
              <div class="list-icon"></div>
              <div class="list-item-name">
                {{item.stName}}
              </div>
              <div class="list-item-status item-red"
                   v-if="item.status==1">离线</div>
              <div class="list-item-status item-green"
                   v-if="item.status==0">在线</div>
              <div class="list-item-status item-org"
                   v-if="item.status==2">低电压</div>
            </div>
          </van-list>
        </van-pull-refresh>
      </div>

      isRefreshing: false, //是否处于刷新状态
      loading: false, //数据是否处于加载状态
      finished: false, //数据是否加载完毕
      listData: [], //列表数据
       query: {
        current: 1,
        size: 10,
      },

    //触发事件
    handleEvent (event) {
      switch (event) {
        //下拉刷新数据
        case "refresh":
          this.finished = false;
          this.loading = true;
          this.onLoadData();
          break;
        //上拉加载数据
        case "load":
          this.onLoadData();
          break;
        default:
          this.eventType = event;
          this.showPopup = true;
          break;
      }
    },

    //请求数据
    onLoadData () {
      if (this.isRefreshing) {
        this.listData = [];
        this.query.current = 1;
        this.isRefreshing = false;
      }

      let formdata = new FormData()
      formdata.append('size', this.query.size)
      formdata.append('current', this.query.current)
      formdata.append('searchStr', this.searchStr)
      formdata.append('type', 4)


      http.post(this.$api.sipingsitemonitor.getSiteList, formdata).then(res => {
        if (res.data.code === 200) {
          var newarr = res.data.data.records

          newarr.map(item => {
            item.stName = item.stName.substring(6)
          })

          this.listData = [...this.listData, ...newarr];
          console.log(this.listData);
          this.loading = false;

          if (res.data.data.records.length < this.query.size) {
            this.finished = true;
          } else {
            this.query.current++;
          }
        } else {
          this.loading = false;
          this.finished = true;
          this.$toast({
            message: res.data.msg,
            type: "fail"
          })
        }
      }).catch(() => {
        this.loading = false;
        this.finished = true;
      })
    },