加载更多

<script>
    let page = 1
    let size = 20
    export default {
        data() {
            return {
                list: [],
                id: 0,
                is_More: true, //更多数据
                msg: '',
            };
        },
        onLoad() {
            this.list = [];
            page = 1
            this.getList()//
        },
        onReachBottom() {
            this.getList()// 下拉刷新
        },

        methods: {
            getList() {
                // 如果没有更多数据,就不在发请求
                if (!this.is_More) {
                    return
                }
          
                this.$api.request({
                    url: '您的请求地址',
                    data: {
                        page,
                        size,
                        id: this.id
                    },
                    success: res => {
                        // 如果大于2页以上
                        if (page >= 2) {
                            if (res.data.data.content.length < size && res.data.data.content.length == 0) {
                                this.is_More = false;//不再加载
                                this.msg = "--全部加载完--"
                            }
                            this.list.push(...res.data.data.content) //拼接数据
                        } else {
                            this.list = []
                            this.list.push(...res.data.data.content)
                            if (page == 1 && res.data.data.content.length < size) {
                                                                //只有一页数据
                                this.is_More = false;
                                this.msg = "--没有商品--"
                            }
                        }
                        page++
                    }
                });
            }
              },
  }
</script>