Selaa lähdekoodia

滚动加载表格修改

duy 1 vuosi sitten
vanhempi
commit
90ba611639
1 muutettua tiedostoa jossa 13 lisäystä ja 12 poistoa
  1. 13 12
      src/views/transfer/components/visual-table.vue

+ 13 - 12
src/views/transfer/components/visual-table.vue

@@ -64,18 +64,17 @@ onUnmounted(() => {
       // 卸载
       tableRef.value.tableRef && tableRef.value.tableRef.$refs.bodyWrapper.removeEventListener('mousewheel', scrollBehavior)
     })
-const queryData = ()=>{
-
-        // 一条一条加载记录,直至遍历到最后一条
-        while (needle.value < allData.value.length ) {
-          let pusharr = allData.value.slice(needle.value, needle.value + 10)
-          pusharr.forEach((ele)=>{
-            tableData.value.push(ele)
+const queryData = async ()=>{
+    console.log('查询数据')
+        let ortab = tableData.value
+        if (needle.value < allData.value.length) {
+           let pusharr = allData.value.slice(needle.value, needle.value + 10)
+            pusharr.forEach((ele)=>{
+                ortab.push(ele)
           })
-          proxy.$forceUpdate()
           needle.value = needle.value + 10
-          
-          }
+          return ortab
+        }
       
 }
 
@@ -90,8 +89,10 @@ const scrollBehavior = async (e)=>{
         // 父容器高度 + 子容器距离父容器顶端的高度 = 子容器可滚动的高度
         if (clientHeight + scrollTop === scrollHeight) {
           console.log('竖向滚动条已经滚动到底部')
-          queryData()
-      
+          const res = await queryData()
+          if (res) {
+            tableData.value = res
+          }
          
         }
       }