<template>
  <van-pull-refresh class="m-scroll" v-model="refreshing" @refresh="onRefresh">
    <van-list v-model="loading" :finished="finished" @load="onLoad">
      <slot></slot>
    </van-list>
  </van-pull-refresh>
</template>

<script>
export default {
  props: {
    size: {
      type: Number,
      default: 10,
    },
  },
  data() {
    return {
      refreshing: false,
      loading: false,
      finished: false,
      page: 1,
    };
  },
  methods: {
    onRefresh() {
      let cb = () => {
        this.refreshing = false;
      };
      this.$emit("refresh", cb);
    },
    onLoad() {
      let cb = (len, total) => {
        this.loading = false;
        this.finished = (this.page - 1) * this.size + len >= total;
        this.page++;
      };
      this.$emit("load", this.page, cb);
    },
  },
};
</script>

<style lang="less">
.m-scroll {
}
</style>
