数据请求调公用方法点击这里：https://www.jianshu.com/p/836fa9112cc4

HTML

<van-list v-model="vanListLoading" :finished="finished" :finished-text="finishedText" @load="vanList_more">
        <li v-for="(item,index) of list" :key="index">
          {{ index }}{{ item.name }}
        </li>
</van-list>

js

<script>
import { nameList } from '../../../api/api' //接口
export default {
  data() {
    return {
      list: [],
      vanListLoading: false, // 加载状态
      finished: false, // 是否加载
      finishedText: '',
      pages: 0, // 页数
      pnums: 10 // 条数
    }
  },
  methods: {
    vanList_more: function() {
      this.pages += 1 // 页数+1
      this.getList()
    },
    getList() {
      const db = {
        pages: this.pages,
        pnums: this.pnums
      }
      this.$post(nameList, db).then(res => {
        this.finishedText = ''
        if (res.code === 1) {
          this.vanListLoading = false
          if (res.data.length > 0) {
            this.list = this.list.concat(res.data) // 追加数据
            this.finished = false
          }
          // 如果当前页数 = 总页数，则已经没有数据
          if (this.pages === Math.ceil(res.count / this.pnums)) {
            this.finished = true
            this.finishedText = '- 没有更多了-'
          }
        } else {
          this.finished = true
          this.finishedText = '- 没有更多了-'
        }
      })
    }
  }
}
</script>