fix(field): fixed clear button incorrectly displaying when value has default value (#5792)

packages/definitions/index.ts

@@ -7,6 +7,7 @@ interface VantComponentInstance {
     detail?: unknown,
     options?: WechatMiniprogram.Component.TriggerEventOption
   ) => void;
+  setView: (value: Record<string, any>, callback?: () => void) => void;
 }
 
 export type VantComponentOptions<

packages/field/index.ts

@@ -66,6 +66,20 @@ VantComponent({
     showClear: false,
   },
 
+  watch: {
+    value(this: WechatMiniprogram.Component.TrivialInstance, value) {
+      if (value !== this.value) {
+        this.setData({ innerValue: value });
+        this.value = value;
+
+        this.setShowClear();
+      }
+    },
+    clearTrigger() {
+      this.setShowClear();
+    },
+  },
+
   created() {
     this.value = this.data.value;
     this.setData({ innerValue: this.value });
@@ -204,7 +218,7 @@ VantComponent({
         showClear = hasValue && trigger;
       }
 
-      this.setData({ showClear });
+      this.setView({ showClear });
     },
 
     noop() {},

packages/field/props.ts

@@ -1,13 +1,5 @@
 export const commonProps: WechatMiniprogram.Component.PropertyOption = {
-  value: {
+  value: String,
-    type: String,
-    observer(this: WechatMiniprogram.Component.TrivialInstance, value) {
-      if (value !== this.value) {
-        this.setData({ innerValue: value });
-        this.value = value;
-      }
-    },
-  },
   placeholder: String,
   placeholderStyle: String,
   placeholderClass: String,

packages/mixins/basic.ts

@@ -13,5 +13,28 @@ export const basic = Behavior({
 
       return new Promise((resolve) => wx.nextTick(resolve));
     },
+
+    // high performance setData
+    setView(
+      this: WechatMiniprogram.Component.TrivialInstance,
+      data: Record<string, any>,
+      callback?: () => void
+    ) {
+      const target: Record<string, any> = {};
+      let hasChange = false;
+
+      Object.keys(data).forEach((key) => {
+        if (data[key] !== this.data[key]) {
+          target[key] = data[key];
+          hasChange = true;
+        }
+      });
+
+      if (hasChange) {
+        return this.setData(target, callback);
+      }
+
+      return callback && callback();
+    },
   },
 });