添加上拉加载

src/views/home/learn/page-learn-recommend.vue

@@ -5,7 +5,7 @@
         v-model="loading"
         :finished="finished"
         finished-text="没有更多了"
-        @load="onLoad"
+        @load="onLoad()"
       >
         <template>
           <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
@@ -31,7 +31,7 @@
             <div
               v-if="
                 contentItem.type == 'ARTICLE' ||
-                  contentItem.type == 'THIRD_PARTY'
+                contentItem.type == 'THIRD_PARTY'
               "
               class="contentItemTitleTitleRow"
             >
@@ -77,7 +77,7 @@
               <div class="contentItemDescriptionTime">
                 {{
                   formateDatesFun(contentItem.createdTime) ||
-                    contentItem.createdTime
+                  contentItem.createdTime
                 }}
               </div>
               <div class="contentItemDescriptionStudyNeedTime">
@@ -108,7 +108,10 @@ export default {
       isLoading: false,
       swiperList: [],
       arrowRightPng: require("@/assets/image/learn/arrowRight.png"),
-      redIcon: require("@/assets/image/learn/redIcon.jpg")
+      redIcon: require("@/assets/image/learn/redIcon.jpg"),
+      learnFlag: true, // 防抖
+      pageIndex: 0,
+      pageSize: 10
     };
   },
   computed: {
@@ -120,6 +123,7 @@ export default {
     // 监听：工种
     chooseEngneeringWork(value) {
       if (value.value) {
+        this.pageIndex = 0;
         this.getNewsfeed(); // 查询子目录
       }
     }
@@ -163,17 +167,27 @@ export default {
       if (this.chooseEngneeringWork) {
         engineertypeid = this.chooseEngneeringWork.id;
       }
-
-      let params = { engineertypeid: engineertypeid };
-      this.$_http
-        .get(this.$_API.JTXT_GET_NEWSFEED, { params })
-        .then(res => {
-          this.formatNeedStudyTodayFun(res.data);
-          this.finished = true;
-        })
-        .catch(() => {
-          this.$store.commit("toggleLoading", false);
-        });
+      let params = {
+        engineertypeid: engineertypeid,
+        page: this.pageIndex,
+        size: this.pageSize
+      };
+      if (this.learnFlag) {
+        this.learnFlag = false;
+        this.$_http
+          .get(this.$_API.JTXT_GET_NEWSFEED, { params })
+          .then(res => {
+            this.formatNeedStudyTodayFun(res.data.content);
+            this.finished = res.data.last;
+            this.pageIndex++;
+            this.loading = false;
+            this.learnFlag = true;
+          })
+          .catch(() => {
+            this.finished = true;
+            this.$store.commit("toggleLoading", false);
+          });
+      }
     },
     // 判断是否今日必学
     formatNeedStudyTodayFun(datas) {
@@ -185,9 +199,12 @@ export default {
           }
         });
       });
-      this.contentList = datas;
+      this.contentList = [...this.contentList, ...datas];
+    },
+    onLoad() {
+      console.log("---aaa--");
+      this.getNewsfeed();
     },
-    onLoad() {},
     chooseContent(contentItem, index) {
       if (contentItem.type === "THIRD_PARTY") {
         if (contentItem.contents) {
@@ -202,6 +219,8 @@ export default {
       }
     },
     onRefresh() {
+      this.pageIndex = 0;
+      this.contentList = [];
       this.getNewsfeed();
       this.getCarousels();
       setTimeout(() => {