update vc-form to 2.4.8

components/vc-form/index.js

@@ -1,3 +1,3 @@
-// based on rc-form 2.4.1
+// based on rc-form 2.4.8
 import { createForm, createFormField } from './src/';
 export { createForm, createFormField };

components/vc-form/src/createBaseForm.jsx

@@ -2,6 +2,7 @@ import AsyncValidator from 'async-validator';
 import warning from 'warning';
 import get from 'lodash/get';
 import set from 'lodash/set';
+import eq from 'lodash/eq';
 import omit from 'lodash/omit';
 import createFieldsStore from './createFieldsStore';
 import { cloneElement } from '../../_util/vnode';
@@ -126,7 +127,14 @@ function createBaseForm(option = {}, mixins = []) {
             const valuesAllSet = {};
             valuesAll[name] = value;
             Object.keys(valuesAll).forEach(key => set(valuesAllSet, key, valuesAll[key]));
-            onValuesChange(this, set({}, name, value), valuesAllSet);
+            onValuesChange(
+              {
+                [formPropName]: this.getForm(),
+                ...this.$props,
+              },
+              set({}, name, value),
+              valuesAllSet,
+            );
           }
           const field = this.fieldsStore.getField(name);
           return { name, field: { ...field, value, touched: true }, fieldMeta };
@@ -135,6 +143,7 @@ function createBaseForm(option = {}, mixins = []) {
         onCollect(name_, action, ...args) {
           const { name, field, fieldMeta } = this.onCollectCommon(name_, action, args);
           const { validate } = fieldMeta;
+          this.fieldsStore.setFieldsAsDirty();
           const newField = {
             ...field,
             dirty: hasRules(validate),
@@ -150,6 +159,7 @@ function createBaseForm(option = {}, mixins = []) {
             ...field,
             dirty: true,
           };
+          this.fieldsStore.setFieldsAsDirty();
           this.validateFieldsInternal([newField], {
             action,
             options: {
@@ -243,7 +253,7 @@ function createBaseForm(option = {}, mixins = []) {
           if (process.env.NODE_ENV !== 'production') {
             warning(
               this.fieldsStore.isValidNestedFieldName(name),
-              'One field name cannot be part of another, e.g. `a` and `a.b`.',
+              `One field name cannot be part of another, e.g. \`a\` and \`a.b\`. Check field: ${name}`,
             );
             warning(
               !('exclusive' in usersFieldOption),
@@ -346,7 +356,14 @@ function createBaseForm(option = {}, mixins = []) {
               (acc, name) => set(acc, name, this.fieldsStore.getField(name)),
               {},
             );
-            onFieldsChange(this, changedFields, this.fieldsStore.getNestedAllFields());
+            onFieldsChange(
+              {
+                [formPropName]: this.getForm(),
+                ...this.$props,
+              },
+              changedFields,
+              this.fieldsStore.getNestedAllFields(),
+            );
           }
           if (templateContext) {
             templateContext.$forceUpdate();
@@ -381,7 +398,14 @@ function createBaseForm(option = {}, mixins = []) {
           this.setFields(newFields, callback);
           if (onValuesChange) {
             const allValues = this.fieldsStore.getAllValues();
-            onValuesChange(this, changedValues, allValues);
+            onValuesChange(
+              {
+                [formPropName]: this.getForm(),
+                ...this.$props,
+              },
+              changedValues,
+              allValues,
+            );
           }
         },
 
@@ -501,7 +525,38 @@ function createBaseForm(option = {}, mixins = []) {
             };
             if (errors && errors.length) {
               errors.forEach(e => {
-                const fieldName = e.field;
+                const errorFieldName = e.field;
+                let fieldName = errorFieldName;
+
+                // Handle using array validation rule.
+                // ref: https://github.com/ant-design/ant-design/issues/14275
+                Object.keys(allRules).some(ruleFieldName => {
+                  const rules = allRules[ruleFieldName] || [];
+
+                  // Exist if match rule
+                  if (ruleFieldName === errorFieldName) {
+                    fieldName = ruleFieldName;
+                    return true;
+                  }
+
+                  // Skip if not match array type
+                  if (
+                    rules.every(({ type }) => type !== 'array') &&
+                    errorFieldName.indexOf(ruleFieldName) !== 0
+                  ) {
+                    return false;
+                  }
+
+                  // Exist if match the field name
+                  const restPath = errorFieldName.slice(ruleFieldName.length + 1);
+                  if (/^\d+$/.test(restPath)) {
+                    fieldName = ruleFieldName;
+                    return true;
+                  }
+
+                  return false;
+                });
+
                 const field = get(errorsGroup, fieldName);
                 if (typeof field !== 'object' || Array.isArray(field)) {
                   set(errorsGroup, fieldName, { errors: [] });
@@ -516,7 +571,7 @@ function createBaseForm(option = {}, mixins = []) {
               const fieldErrors = get(errorsGroup, name);
               const nowField = this.fieldsStore.getField(name);
               // avoid concurrency problems
-              if (nowField.value !== allValues[name]) {
+              if (!eq(nowField.value, allValues[name])) {
                 expired.push({
                   name,
                 });
@@ -583,9 +638,7 @@ function createBaseForm(option = {}, mixins = []) {
                 return field;
               });
             if (!fields.length) {
-              if (callback) {
               callback(null, this.fieldsStore.getFieldsValue(fieldNames));
-              }
               return;
             }
             if (!('firstFields' in options)) {
@@ -604,7 +657,7 @@ function createBaseForm(option = {}, mixins = []) {
             );
           });
           pending.catch(e => {
-            if (console.error) {
+            if (console.error && process.env.NODE_ENV !== 'production') {
               console.error(e);
             }
             return e;

components/vc-form/src/createFieldsStore.jsx

@@ -1,6 +1,6 @@
 import set from 'lodash/set';
 import createFormField, { isFormField } from './createFormField';
-import { flattenFields, getErrorStrs, startsWith } from './utils';
+import { hasRules, flattenFields, getErrorStrs, startsWith } from './utils';
 
 function partOf(a, b) {
   return b.indexOf(a) === 0 && ['.', '['].indexOf(b[a.length]) !== -1;
@@ -92,6 +92,19 @@ class FieldsStore {
     this.fieldsMeta[name] = meta;
   }
 
+  setFieldsAsDirty() {
+    Object.keys(this.fields).forEach(name => {
+      const field = this.fields[name];
+      const fieldMeta = this.fieldsMeta[name];
+      if (field && fieldMeta && hasRules(fieldMeta.validate)) {
+        this.fields[name] = {
+          ...field,
+          dirty: true,
+        };
+      }
+    });
+  }
+
   getFieldMeta(name) {
     this.fieldsMeta[name] = this.fieldsMeta[name] || {};
     return this.fieldsMeta[name];