commit

@@ -6,8 +6,9 @@
           v-for="(item, index) in visibleItems"
           :key="index"
           class="cube-recycle-list-item"
+          :class="thumbClass"
           :ref="'loads'+index"
-          :style="{transform: 'translate(0,' + item.top + 'px)', 'z-index': visibleItems.length - index}"
+          :style="{transform: isThumb ? void 0 : 'translate(0,' + item.top + 'px)', 'z-index': visibleItems.length - index}"
         >
           <div
             v-if="infinite"
@@ -61,7 +62,6 @@
 import CubeLoading from 'cube-ui/src/components/loading/loading.vue';
 
 const EVENT_SCROLL = 'scroll';
-const EVENT_RESIZE = 'resize';
 
 export default {
   name: 'RecycleList',
@@ -74,7 +74,8 @@ export default {
       currentIndex: 0,
       loadings: [],
       startOffset: 0,
-      noMore: false
+      noMore: false,
+      thumbsList: this.thumbs,
     };
   },
   props: {
@@ -93,19 +94,38 @@ export default {
     onFetch: {
       type: Function,
       required: true
+    },
+    thumbs: {
+      type: Array,
+      default() {
+        return [];
+      }
     }
   },
   computed: {
     visibleItems() {
-      const items = this.items.slice(Math.max(0, this.startIndex - this.size), Math.min(this.items.length, this.startIndex + this.size));
-
-      return items;
+      if (this.thumbsList.length) {
+        return this.thumbsList.map(item => {
+          return {
+            data: item
+          };
+        });
+      }
+      return this.items.slice(Math.max(0, this.startIndex - this.size), Math.min(this.items.length, this.startIndex + this.size));
     },
     tombHeight() {
       return this.infinite ? this.$refs.tomb && this.$refs.tomb.offsetHeight : 0;
     },
     loading() {
-      return this.loadings.length;
+      return this.loadings.length && this.isThumb;
+    },
+    isThumb() {
+      return !!this.thumbsList.length;
+    },
+    thumbClass() {
+      return {
+        thumb: this.isThumb
+      };
     }
   },
   watch: {
@@ -159,7 +179,6 @@ export default {
       if (reload) {
         this.noMore = false;
         this.list = [];
-        this.items = [];
       }
       this.loadings.push('pending');
       this.onFetch().then((res) => {
@@ -190,6 +209,9 @@ export default {
         }));
       }
       window.Promise.all(promiseTasks).then(() => {
+        if (this.thumbsList.length) {
+          this.thumbsList = [];
+        }
         this.updateItemTop();
       });
     },
@@ -311,6 +333,8 @@ export default {
     width: 100%
     position: absolute
     box-sizing: border-box
+    &.thumb
+      position relative
   .cube-recycle-list-transition
     position: absolute
     opacity: 0

@@ -2,11 +2,8 @@
   <Article
     ref="article"
     type="article"
-    :thumb="true"
+    :thumbs="articleThumbList"
     :on-fetch="onFetch">
-    <template v-slot:thumb>
-      <ArticleItem :thumb="true" type="article" v-for="(item, index) in articleThumbList" :key="index" :data="item"></ArticleItem>
-    </template>
   </Article>
 </template>
 

@@ -35,7 +35,7 @@ export default {
   computed: {
     invisibleClass() {
       return {
-        invisible: this.thumb
+        invisible: !this.data.hasAttention
       };
     }
   },

@@ -60,7 +60,7 @@ export default {
     ...mapState(['articleStates']),
     invisibleClass() {
       return {
-        invisible: this.thumb
+        invisible: !this.articleState.hasFavor && !this.articleState.hasPraise
       };
     },
     articleState() {

@@ -12,7 +12,7 @@
           <WidgetFollow :share="share" class="widget-follow" :author-uid="currentAuthor.authorUid" :follow="currentAuthor.hasAttention === 'Y'" @on-follow="follow => onFollow(currentAuthor, follow)"></WidgetFollow>
         </template>
       </LayoutHeader>
-      <LayoutRecycleList :size="10" ref="scroll" @scroll="onScroll" :offset="2000" :on-fetch="onScrollFetch">
+      <LayoutRecycleList :size="10" :thumbs="thumbs" ref="scroll" @scroll="onScroll" :offset="2000" :on-fetch="onFetch">
         <template class="article-item" v-slot:item="{ data }">
           <ArticleItem
             :id="`item${data.index}`"
@@ -27,9 +27,6 @@
           <div :id="`ph${data.index}`"></div>
         </template>
       </LayoutRecycleList>
-      <div class="thumbs" v-if="showThumb">
-        <slot name="thumb"></slot>
-      </div>
     </Layout>
     <ArticleActionSheet v-if="showArticleDetailAction" ref="actionSheet"></ArticleActionSheet>
     <YohoActionSheet transfer v-if="showCommentAction" ref="commentAction" :full="true">
@@ -54,20 +51,19 @@ export default {
     },
     share: Boolean,
     type: String,
-    thumb: Boolean,
-    onFetch: Function
+    onFetch: Function,
+    thumbs: {
+      type: Array,
+      default() {
+        return [];
+      }
+    }
   },
   mounted() {
     this.scrollPreLazy = debounce(this.changeItem.bind(this), 200);
   },
-  computed: {
-    showThumb() {
-      return !this.isMounted && this.thumb;
-    }
-  },
   data() {
     return {
-      isMounted: false,
       articleId: 0,
       articleIndex: -1,
       showCommentAction: false,
@@ -89,19 +85,11 @@ export default {
   },
   activated() {
     if (this.scrollTop > 0) {
-      this.$refs.scroll.$el.scrollTo(0, this.scrollTop);
+      this.$refs.scroll.$el.scrollTop = this.scrollTop;
     }
   },
   methods: {
     ...mapMutations(['CHANGE_ARTICLE_LIST_PRELAZY', 'ASYNC_ARTICLE_COMMENT']),
-    async onScrollFetch() {
-      const result = await this.onFetch();
-
-      setTimeout(() => {
-        this.isMounted = true;
-      }, 0);
-      return result;
-    },
     toUserPage() {
       if (this.share) {
         return this.$links.toDownloadApp();

@@ -3,11 +3,8 @@
     ref="article"
     :title="userName"
     type="userArticle"
-    :thumb="true"
+    :thumbs="articleUserThumbList"
     :on-fetch="onFetch">
-    <template v-slot:thumb>
-      <ArticleItem type="userArticle" v-for="(item, index) in articleUserThumbList" :key="index" :data="item"></ArticleItem>
-    </template>
   </Article>
 </template>
 

@@ -39,9 +39,9 @@ function setArticleList(state, data, type, thumb) {
       updateArticleState(state, item);
     } else {
       item.comments = [];
-      item.hasAttention = 'N';
-      item.hasFavor = 'N';
-      item.hasPraise = 'N';
+      item.hasAttention = '';
+      item.hasFavor = '';
+      item.hasPraise = '';
       item.commentCount = 0;
       item.favoriteCount = 0;
       item.praiseCount = 0;