fix: initialValue should also be validate

Author: zombieJ

docs/examples/validate-perf.tsx

@@ -1,4 +1,4 @@
-/* eslint-disable react/prop-types */
+/* eslint-disable react/prop-types, @typescript-eslint/consistent-type-imports */
 
 import React from 'react';
 import Form, { Field, FormInstance } from 'rc-field-form';
@@ -34,7 +34,7 @@ export default class Demo extends React.Component {
     console.log('Failed:', errorInfo);
   };
 
-  public onPasswordError = (errors: string[]) => {
+  public onPasswordError = ({ errors }: { errors: string[] }) => {
     console.log('🐞 Password Error:', errors);
   };
 
@@ -64,12 +64,13 @@ export default class Demo extends React.Component {
                 },
               },
             ]}
-            onError={this.onPasswordError}
+            onMetaChange={this.onPasswordError}
           >
             <Input placeholder="password" />
           </LabelField>
 
           <LabelField
+            initialValue="123"
             name="password2"
             dependencies={['password']}
             messageVariables={{ displayName: '密码2' }}

src/Field.tsx

@@ -126,7 +126,11 @@ class Field extends React.Component<InternalFieldProps, FieldState> implements F
    */
   private touched: boolean = false;
 
-  /** Mark when touched & validated. Currently only used for `dependencies` */
+  /**
+   * Mark when touched & validated. Currently only used for `dependencies`.
+   * Note that we do not think field with `initialValue` is dirty
+   * but this will be by `isFieldDirty` func.
+   */
   private dirty: boolean = false;
 
   private validatePromise: Promise<string[]> | null = null;
@@ -418,7 +422,21 @@ class Field extends React.Component<InternalFieldProps, FieldState> implements F
 
   public isFieldTouched = () => this.touched;
 
-  public isFieldDirty = () => this.dirty;
+  public isFieldDirty = () => {
+    // Touched or validate or has initialValue
+    if (this.dirty || this.props.initialValue !== undefined) {
+      return true;
+    }
+
+    // Form set initialValue
+    const { fieldContext } = this.props;
+    const { getInitialValue } = fieldContext.getInternalHooks(HOOK_MARK);
+    if (getInitialValue(this.getNamePath()) !== undefined) {
+      return true;
+    }
+
+    return false;
+  };
 
   public getErrors = () => this.errors;
 

src/FieldContext.ts

@@ -38,6 +38,7 @@ const Context = React.createContext<InternalFormInstance>({
       getFields: warningFunc,
       setValidateMessages: warningFunc,
       setPreserve: warningFunc,
+      getInitialValue: warningFunc,
     };
   },
 });

src/interface.ts

@@ -198,6 +198,7 @@ export interface InternalHooks {
   getFields: (namePathList?: InternalNamePath[]) => FieldData[];
   setValidateMessages: (validateMessages: ValidateMessages) => void;
   setPreserve: (preserve?: boolean) => void;
+  getInitialValue: (namePath: InternalNamePath) => StoreValue;
 }
 
 /** Only return partial when type is not any */

src/useForm.ts

@@ -111,6 +111,7 @@ export class FormStore {
         setValidateMessages: this.setValidateMessages,
         getFields: this.getFields,
         setPreserve: this.setPreserve,
+        getInitialValue: this.getInitialValue,
       };
     }