From 93768186ca58acd0fc0b6963d0e017979c087631 Mon Sep 17 00:00:00 2001 From: inleft <inleft@qq.com> Date: Tue, 23 Aug 2022 02:09:58 +0800 Subject: [PATCH] 上下篇日志提示加入 --- src/components/group/articleListScorll.vue | 22 +++++++++++++--------- 1 files changed, 13 insertions(+), 9 deletions(-) diff --git a/src/components/group/articleListScorll.vue b/src/components/group/articleListScorll.vue index d7d4aa5..10a9364 100644 --- a/src/components/group/articleListScorll.vue +++ b/src/components/group/articleListScorll.vue @@ -1,24 +1,24 @@ <template> - <div> + <div class="fade"> <div v-infinite-scroll="loadMore" infinite-scroll-disabled="busy" :infinite-scroll-distance="10"> <div class="mySecret" v-if="data.length==0"> <p>空空如也..</p> </div> <div v-for="(temp,index) in data"> - <newArticle v-bind="temp" :index="index"></newArticle> + <newArticle v-bind="temp" :index="index" :typeId="typeId"></newArticle> <!-- <box5 v-bind="temp"></box5> --> </div> - <div v-if="loading && !busy" class="demo-loading-container"> + <div v-if="loading && !busy" class="loading-container"> <a-spin /> </div> </div> <a-row type="flex" justify="center"> <div style="position:fixed;bottom: 10px;"> <a-pagination @change="onChange" :showQuickJumper="true" :size="size" v-model="current" - :defaultPageSize="defaultPageSize" :pageSize="pageSize" :total="total" /> + :showLessItems="true" :defaultPageSize="defaultPageSize" :pageSize="pageSize" :total="total" /> </div> </a-row> @@ -27,13 +27,10 @@ <script> import infiniteScroll from 'vue-infinite-scroll'; import box5 from "../mini/box5-article.vue" - import babyActicle from '../../assets/baby.htm' import newArticle from "../mini/box-new-article.vue" - import shijie from '../../assets/shijie.htm' import { queryBlogArticleList } from '../../api/blogArticle.js' - export default { @@ -55,7 +52,7 @@ total: 1, pageSize: 6, current: 1, - defaultPageSize: 10 + defaultPageSize: 10, }; }, created() { @@ -68,15 +65,22 @@ } }, typeId: function(newValue, oldValue) { + //有条件不刷新 + // if (newValue == undefined || oldValue == "") { + // return + // } + this.busy = true; this.$message.info('loading', 0.3); this.onChange(1); }, }, activated() { + this.busy = false; window.addEventListener('scroll', this); }, deactivated() { + this.busy = true; window.removeEventListener('scroll', this); }, methods: { @@ -130,7 +134,7 @@ }; </script> <style> - .demo-loading-container { + .loading-container { position: absolute; bottom: 40px; width: 100%; -- Gitblit v1.9.1