首页 > 解决方案 > 验证器不是函数错误 - 对最终表单字段数组做出反应

问题描述

我正在尝试在我的 React App 中使用 final-form-field-arrays 组件。当我尝试使用它时,我得到一个“验证器不是函数错误”。

我将其追溯到 final-form.es.js 中的 runFieldLevelValidation 函数

var runFieldLevelValidation = function runFieldLevelValidation(field, setError) {
    var validators = field.validators;
    console.log(field);
    console.log(field.validators);
    var promises = [];
    var validatorKeys = Object.keys(validators);
    if (validatorKeys.length) {
      var error = void 0;
      Object.keys(validators).forEach(function (index) {
        var validator = validators[Number(index)];
        if (!validator.getValidator) {
        var errorOrPromise = validator(getIn(state.formState.values, field.name), state.formState.values);
        if (errorOrPromise && isPromise(errorOrPromise)) {
          promises.push(errorOrPromise.then(setError));
        } else if (!error) {
          // first registered validator wins
          error = errorOrPromise;
        }
        }
      });
      setError(error);
    }
    return promises;
  };

有问题的行是

var errorOrPromise = validator(getIn(state.formState.values, field.name), state.formState.values);

记录字段后(如上所示),我发现 FieldArray 字段本身没有验证器函数,而是有一个 getValidator 函数。我给它打了补丁,它正在工作,但我认为这不应该是必需的

我有问题的反应代码是

 <Field name="name" component={RenderField} type="text" label="Name" />
                   <Field name="date" component={RenderField} type="date" text={moment().format('LL')} 
                   label="Date of Service" />
                   <Field name="time" type="select" component={RenderField} label="Time of Service" 
                   selectedOption={moment().format('k mm')} options={this.generateAppointmentTimes()} />
                          <FieldArray name="customers" >
         
        </FieldArray>

关于如何在没有猴子补丁的情况下使其工作的任何想法?

标签: reactjstypescriptreact-final-formfinal-formreact-final-form-arrays

解决方案


所以,事实证明我使用的是一个非常旧的 Final-Form 版本,以及 Final-Form-Arrays。我更新了,错误消失了


推荐阅读