Browse Source

修复列表翻页闪烁问题

cuiyalong 5 năm trước cách đây
mục cha
commit
505344242d
1 tập tin đã thay đổi với 20 bổ sung14 xóa
  1. 20 14
      src/views/main/Home.vue

+ 20 - 14
src/views/main/Home.vue

@@ -9,7 +9,6 @@
         finished-text="没有更多了"
         @load="onLoad"
         :offset="50"
-        :key="isRe"
       >
         <ul class="list">
           <li class="item" v-for="item in listState.list" :key="item.id" @click="goDetail(item)">
@@ -69,8 +68,8 @@ export default class Home extends Vue {
   protected getList!: any
   protected saveList!: any
   protected clearList!: any
+
   isLoading = false
-  isRe = 0
   listState = {
     list: [],
     loading: false,
@@ -80,6 +79,15 @@ export default class Home extends Vue {
     scroll: 0
   }
 
+  defaultListState = {
+    list: [],
+    loading: false,
+    finished: false,
+    currentPage: 1,
+    totalPage: 0,
+    scroll: 0
+  }
+
   beforeRouteEnter (to, from, next) {
     if (from.name === 'detail') {
       to.meta.isBack = true
@@ -91,21 +99,20 @@ export default class Home extends Vue {
 
   activated () {
     if (!this.$route.meta.isBack) {
-      this.listState = {
-        list: [],
-        loading: false,
-        finished: false,
-        currentPage: 1,
-        totalPage: 0,
-        scroll: 0
+      for (const key in this.defaultListState) {
+        this.listState[key] = this.defaultListState[key]
       }
-      this.getReportList()
-      return
+      return this.getReportList()
     }
+
+    // 恢复数据
     this.$route.meta.isBack = false
-    this.listState = this.reportList()
+    const storeListState = this.reportList()
+    for (const key in storeListState) {
+      this.listState[key] = storeListState[key]
+    }
     this.$nextTick(() => {
-      ;(this.$refs.wrapper as any).scrollTop = this.reportList().scroll
+      ;(this.$refs.wrapper as any).scrollTop = storeListState.scroll
     })
   }
 
@@ -137,7 +144,6 @@ export default class Home extends Vue {
           this.listState.list = rows
         } else {
           this.listState.list = this.listState.list.concat(rows)
-          this.isRe += 1
         }
       } else {
         this.listState.finished = true