Просмотр исходного кода

perf: 【IoT 物联网】场景联动 nextTick 优化使用 await nextTick()

puhui999 7 месяцев назад
Родитель
Сommit
f3d1989832

+ 3 - 8
src/views/iot/rule/scene/form/RuleSceneForm.vue

@@ -237,10 +237,6 @@ const handleSubmit = async () => {
   // 提交请求
   submitLoading.value = true
   try {
-    // 数据结构已对齐,直接使用表单数据
-    console.log('提交数据:', formData.value)
-
-    // 调用API保存数据
     if (isEdit.value) {
       // 更新场景联动规则
       await RuleSceneApi.updateRuleScene(formData.value)
@@ -299,13 +295,12 @@ const initFormData = () => {
 }
 
 // 监听抽屉显示
-watch(drawerVisible, (visible) => {
+watch(drawerVisible, async (visible) => {
   if (visible) {
     initFormData()
     // 重置表单验证状态
-    nextTick(() => {
-      formRef.value?.clearValidate()
-    })
+    await nextTick()
+    formRef.value?.clearValidate()
   }
 })
 

+ 5 - 6
src/views/iot/rule/scene/form/configs/DeviceTriggerConfig.vue

@@ -200,7 +200,7 @@ const handleTriggerTypeChange = (type: number) => {
 }
 
 // 条件组相关方法
-const addSubGroup = () => {
+const addSubGroup = async () => {
   if (!trigger.value.conditionGroups) {
     trigger.value.conditionGroups = []
   }
@@ -211,11 +211,10 @@ const addSubGroup = () => {
   }
 
   // 使用 nextTick 确保响应式更新完成后再添加新的子组
-  nextTick(() => {
-    if (trigger.value.conditionGroups) {
-      trigger.value.conditionGroups.push([])
-    }
-  })
+  await nextTick()
+  if (trigger.value.conditionGroups) {
+    trigger.value.conditionGroups.push([])
+  }
 }
 
 const removeSubGroup = (index: number) => {

+ 5 - 6
src/views/iot/rule/scene/form/configs/SubConditionGroupConfig.vue

@@ -107,7 +107,7 @@ const subGroup = useVModel(props, 'modelValue', emit)
 const maxConditions = computed(() => props.maxConditions || 3)
 
 // 事件处理
-const addCondition = () => {
+const addCondition = async () => {
   // 确保 subGroup.value 是一个数组
   if (!subGroup.value) {
     subGroup.value = []
@@ -128,11 +128,10 @@ const addCondition = () => {
   }
 
   // 使用 nextTick 确保响应式更新完成后再添加新条件
-  nextTick(() => {
-    if (subGroup.value) {
-      subGroup.value.push(newCondition)
-    }
-  })
+  await nextTick()
+  if (subGroup.value) {
+    subGroup.value.push(newCondition)
+  }
 }
 
 const removeCondition = (index: number) => {

+ 8 - 10
src/views/iot/rule/scene/form/inputs/JsonParamsInput.vue

@@ -462,25 +462,23 @@ const handleDataDisplay = (value: string) => {
 // 监听外部值变化(编辑模式数据回显)
 watch(
   () => localValue.value,
-  (newValue, oldValue) => {
+  async (newValue, oldValue) => {
     // 避免循环更新
     if (newValue === oldValue) return
 
     // 使用 nextTick 确保在下一个 tick 中处理数据
-    nextTick(() => {
-      handleDataDisplay(newValue || '')
-    })
+    await nextTick()
+    handleDataDisplay(newValue || '')
   },
   { immediate: true }
 )
 
 // 组件挂载后也尝试处理一次数据回显
-onMounted(() => {
-  nextTick(() => {
-    if (localValue.value) {
-      handleDataDisplay(localValue.value)
-    }
-  })
+onMounted(async () => {
+  await nextTick()
+  if (localValue.value) {
+    handleDataDisplay(localValue.value)
+  }
 })
 
 // 监听配置变化