Quellcode durchsuchen

feat(rollingTable): add watcher to restart scroll when data changes

监听表格数据源变化,当数据更新时先停止原有滚动,在DOM更新后重新启动滚动动画
huoyi vor 3 Wochen
Ursprung
Commit
8af41402a9
1 geänderte Dateien mit 10 neuen und 1 gelöschten Zeilen
  1. 10 1
      src/views/portraitManagement/components/rollingTable.vue

+ 10 - 1
src/views/portraitManagement/components/rollingTable.vue

@@ -16,7 +16,7 @@
16
 </template>
16
 </template>
17
 
17
 
18
 <script setup>
18
 <script setup>
19
-import { ref, computed, onMounted, onUnmounted, nextTick } from 'vue'
19
+import { ref, computed, watch, onMounted, onUnmounted, nextTick } from 'vue'
20
 
20
 
21
 const props = defineProps({
21
 const props = defineProps({
22
   columns: {
22
   columns: {
@@ -94,6 +94,15 @@ onMounted(() => {
94
   }
94
   }
95
 })
95
 })
96
 
96
 
97
+watch(() => props.data, (val) => {
98
+  stopScroll()
99
+  if (val && val.length > 0) {
100
+    nextTick(() => {
101
+      startScroll()
102
+    })
103
+  }
104
+})
105
+
97
 onUnmounted(() => {
106
 onUnmounted(() => {
98
   stopScroll()
107
   stopScroll()
99
 })
108
 })