src/components/group/articleListScorll.vue

@@ -4,8 +4,8 @@
         <div class="mySecret" v-if="data.length==0">
            <p>空空如也..</p>
         </div>
			
         <div v-for="(temp,index) in data" >

         <div v-for="(temp,index) in data">
            <newArticle v-bind="temp" :index="index"></newArticle>
            <!-- <box5 v-bind="temp"></box5> -->
         </div>
@@ -16,7 +16,7 @@
         </div>
      </div>
      <a-row type="flex" justify="center">
         <div style="position:fixed;bottom: 10px;" id="dddadf">
         <div style="position:fixed;bottom: 10px;">
            <a-pagination @change="onChange" :showQuickJumper="true" :size="size" v-model="current"
               :defaultPageSize="defaultPageSize" :pageSize="pageSize" :total="total" />
         </div>
@@ -34,30 +34,7 @@
      queryBlogArticleList
   } from '../../api/blogArticle.js'

   var obj1 = {
      "source": babyActicle,
      "title": "陈奕迅-Body Song 歌词",
      "read": 1101,
      "like": 233,
      "folder": "歌词",
      "publishTime": "2021-05-26",
   }
   var obj2 = {
      "source": shijie,
      "title": "这世界那么多人-吉他谱",
      "read": 3101,
      "like": 113,
      "folder": "吉他谱",
      "publishTime": "2020-05-26",
   }
   var obj3 = {
      "source": shijie,
      "title": "遥远的它-吉他谱",
      "read": 201,
      "like": 13,
      "folder": "吉他谱",
      "publishTime": "2022-07-26",
   }


   export default {
      components: {
@@ -78,18 +55,27 @@
            total: 1,
            pageSize: 6,
            current: 1,
            defaultPageSize:10
            defaultPageSize: 10
         };
      },
      created() {
         this.typeId = this.$route.query.typeId;
      },
      watch: {
         '$route'(to, from) {
            if ("articleList" === to.name) {
            if ("articleList" === to.name || "home" === to.name) {
               this.typeId = this.$route.query.typeId;
            }
         },
         typeId: function(newValue, oldValue) {
            this.busy = true;
            this.$message.info('loading', 0.3);
				
            //有条件不刷新
            if (newValue == undefined && oldValue != "") {
               return
            }

            this.onChange(1);
         },
      },
@@ -99,24 +85,12 @@
      deactivated() {
         window.removeEventListener('scroll', this);
      },
      beforeMount() {
         queryBlogArticleList({
            pageNo: this.current,
            pageSize:this.pageSize,
            typeId: this.typeId
         }).then((res) => {
            this.total = Number(res.data.total)
            this.pageSize = Number(res.data.size);
            this.data = res.data.records;
            return res
         })
      },
      methods: {
         onChange(current) {
            this.current = current;
            queryBlogArticleList({
               pageNo: current,
               pageSize:this.pageSize,
               pageSize: this.pageSize,
               typeId: this.typeId
            }).then((res) => {
               this.busy = false;
@@ -132,7 +106,7 @@

            queryBlogArticleList({
               pageNo: this.current + 1,
               pageSize:this.pageSize,
               pageSize: this.pageSize,
               typeId: this.typeId
            }).then((res) => {

@@ -162,19 +136,6 @@
   };
</script>
<style>
   /* .test {
      overflow: hidden;
      height: 700px;
   }

   .infinite-container {
      overflow: auto;
   }

   .infinite-container::-webkit-scrollbar {
      display: none;
   } */

   .demo-loading-container {
      position: absolute;
      bottom: 40px;