bug fixed

src/views/components/CityOptions/index.vue

@@ -158,19 +158,41 @@ const validateForm = async () => {
 };
 
 getProvinceList();
+
 watch(
-  modelValue,
+  () => modelValue.value.province,
   (val) => {
-    if (val.province) {
-      getCityListByProvinceId(val.province);
-    }
-    if (val.city) {
-      getAreaListByCityId(val.city);
-    }
+    console.log("changed province");
+    val && getCityListByProvinceId(val);
   },
-  { deep: true }
+  {
+    immediate: true,
+  }
 );
 
+watch(
+  () => modelValue.value.city,
+  (val) => {
+    console.log("changed city");
+    val && getAreaListByCityId(val);
+  },
+  {
+    immediate: true,
+  }
+);
+// watch(
+//   modelValue,
+//   (val) => {
+//     if (val.province) {
+//       getCityListByProvinceId(val.province);
+//     }
+//     if (val.city) {
+//       getAreaListByCityId(val.city);
+//     }
+//   },
+//   { deep: true }
+// );
+
 defineExpose({
   validateForm,
 });