debug watch

杨泽宇
1 parent 9318fb38
Showing 1 changed file with 25 additions and 63 deletions
src/views/column/edit.vue
 <script setup lang="ts">
-import { reactive, ref, getCurrentInstance, onMounted, watch } from "vue";
+import {
+  reactive,
+  ref,
+  getCurrentInstance,
+  onMounted,
+  watchEffect,
+} from "vue";
 import { columnAdd, columnEdit } from "@/api/property/column";
 import { useRoute } from "vue-router";
 import { back } from "@/utils/tool";
@@ -45,37 +51,25 @@ const rules = reactive({
       trigger: "blur",
     },
   ],
-  // cmsPageId: [
-  //   {
-  //     required: false,
-  //     message: "请填写CMS页面ID",
-  //     trigger: "blur",
-  //   },
-  // ],
-  // cmsColumnId: [
-  //   {
-  //     required: false,
-  //     message: "请填写CMS栏目ID",
-  //     trigger: "blur",
-  //   },
-  // ],
   cmsPageId: [
     {
-      required: form.data.cmsPageType === 4 && form.data.cmsColumnId? false: true,
+      required:
+        form.data.cmsPageType === 4 && form.data.cmsColumnId ? false : true,
       message: "请填写CMS页面ID",
       trigger: "change",
     },
   ],
   cmsColumnId: [
     {
-      required: form.data.cmsPageType === 4 && form.data.cmsPageId? false: true,
+      required:
+        form.data.cmsPageType === 4 && form.data.cmsPageId ? false : true,
       message: "请填写CMS栏目ID",
       trigger: "change",
     },
   ],
   cmsPageUrl: [
     {
-      required: form.data.cmsPageType === 1? true: false,
+      required: form.data.cmsPageType === 1 ? true : false,
       message: "请填写CMS页面链接",
       trigger: "blur",
     },
@@ -175,6 +169,19 @@ const submitForm = (formEl: InstanceType&lt;typeof ElForm&gt; | undefined) =&gt; {
 const handleImageChange = (url: string, tagName: string) => {
   form.data[tagName] = url;
 };
+watchEffect(() => {
+  // cms页面类型为【原生 4】时，cms栏目ID、cms页面ID必填一个，cms栏目名称选填
+  // cms页面类型为【h5 1】时，页面url必填
+  if (~~form.data.cmsPageType === 4) {
+    rules.cmsPageUrl[0].required = false;
+    rules.cmsPageId[0].required = ~~form.data.cmsColumnId ? false : true;
+    rules.cmsColumnId[0].required = ~~form.data.cmsPageId ? false : true;
+  } else {
+    rules.cmsPageUrl[0].required = true;
+    rules.cmsPageId[0].required = false;
+    rules.cmsColumnId[0].required = false;
+  }
+});
 onMounted(() => {
   form.dataType = useRoute().query.dataType;
   mlen.value = 4;
@@ -188,51 +195,6 @@ onMounted(() =&gt; {
       mlen.value = 6;
       break;
   }
-  // cms页面类型为【原生 4】时，cms栏目ID、cms页面ID必填一个，cms栏目名称选填
-  // cms页面类型为【h5 1】时，页面url必填
-  if(~~form.data.cmsPageType === 4) {
-    rules.cmsPageUrl[0].required = false;
-    rules.cmsPageId[0].required = ~~form.data.cmsColumnId? false: true
-    rules.cmsColumnId[0].required = ~~form.data.cmsPageId? false: true
-  } else {
-    rules.cmsPageUrl[0].required = true
-    rules.cmsPageId[0].required = false
-    rules.cmsColumnId[0].required = false
-  }
-  watch(
-    () => form.data.cmsPageType,
-    (data) => {
-      if (~~data === 4) {
-        rules.cmsPageUrl[0].required = false;
-        rules.cmsColumnId[0].required = form.data.cmsPageId? false: true
-        rules.cmsPageId[0].required = form.data.cmsColumnId? false: true
-      } else if (~~data === 1) {
-        rules.cmsPageUrl[0].required = true;
-        rules.cmsPageId[0].required = false;
-        rules.cmsColumnId[0].required = false;
-      }
-    }
-  );
-  watch(
-    () => form.data.cmsPageId,
-    (data) => {
-      if (~~form.data.cmsPageType === 4) {
-        rules.cmsColumnId[0].required = data ? false : true;
-      } else {
-        rules.cmsColumnId[0].required = false;
-      }
-    }
-  );
-  watch(
-    () => form.data.cmsColumnId,
-    (data) => {
-      if (~~form.data.cmsPageType === 4) {
-        rules.cmsPageId[0].required = data ? false : true;
-      } else {
-        rules.cmsPageId[0].required = false;
-      }
-    }
-  );
   form.data.sort = ~~useRoute().query.sort;
 });
 </script>