修改

src/views/HomeView/PointsMall.vue

@@ -49,7 +49,7 @@
                             <i :class="item.icon"></i>积分
                         </div>
                     </div>
-                    <div class="list-container" v-loading="loading">
+                    <div class="list-container">
                         <el-empty v-if="goodsList.length == 0" :image-size="200"></el-empty>
                         <div v-else class="prize-list">
                             <div v-for="(item, index) in goodsList" :key="index" class="prize-card prize-item">
@@ -150,7 +150,8 @@ import { getTab } from '@/utils/auth'
 export default {
     data() {
         return {
-            loading:true,
+            page:1,
+            pages:1,
             // tab 列表
             options: [],
             goodsName: '',
@@ -214,6 +215,16 @@ export default {
         this.getNotice(this.activeName);
     },
     methods: {
+        // 保存滚动值，这是兼容的写法
+        handleScroll () {
+            if((document.documentElement.scrollTop + window.innerHeight) == document.body.offsetHeight){
+                if(this.page > this.pages){
+                    return
+                }else{
+                    this.getList(this.activeName);
+                }
+            }
+        },
         changeOrderByClause(item) {
             this.orderByClauseList.forEach((element) => {
                 element.checked = false;
@@ -301,28 +312,39 @@ export default {
         getList(val) {
             if (val == 'goodsNotice') {
                 let params = {
+                    limit:8,
+                    page:this.page,
                     name: this.goodsName,
                     productAttribute: this.productAttribute,
                     orderByClause: this.orderByClause,
                     deliveryType: this.deliveryType
                 }
-                this.loading = true;
+               
                 integralList(params).then(response => {
-                    console.log(response.data.data);
-                    this.goodsList = response.data.data;
-                    this.loading = false;
+                    if(this.page==1){
+                        this.goodsList = response.data.data.list;
+                        this.page = response.data.data.pageNum;
+                        this.pages = response.data.data.pages;
+                    }else{
+                        this.goodsList = [
+                            ...this.goodsList,
+                            ...response.data.data.list
+                        ]
+                    }
+                    ++this.page  
                 })
             } else {
-                this.loading = true;
+                
                 festivalList({ welfareId: this.curChosed }).then(response => {
                     console.log(response.data.data);
                     this.goodsList = response.data.data;
-                    this.loading = false;
+                   
                 })
             }
         },
 
         handleClick(tab, event) {
+            this.page = 1;
             console.log(tab.name, event);
             this.getList(tab.name);
             this.getNotice(tab.name);
@@ -336,6 +358,15 @@ export default {
                 }
             });
         },
+    },
+    mounted () {
+        window.addEventListener('scroll', this.handleScroll)
+    },
+
+    destroyed () {
+        console.log('lalalal')
+        // 离开该页面需要移除这个监听的事件，不然会报错
+        window.removeEventListener('scroll', this.handleScroll)
     }
 };
 </script>