React - react-final-form验证

Question

在使用记录级验证时，我有一个关于react-final表单错误消息的问题。我在FormFilterFields组件中有以下字段。

字段名称：

export const fieldNames = {
  password: "field.password"
};

字段：

            <Field name={fieldNames.password}>
                  {({ input, meta }) => {
                    return (
                      <div className={styles.textInputContainer}>
                        <TextInput
                          type={"password"}
                          label={"password"}
                          value={input.value}
                          onChange={(event)=> {
                            input.onChange(event)
                          }}
                          error={meta.error}
                        />
                      </div>
                    );
                  }}
                </Field>

表格：

     <Form
        onSubmit={() => {}}
        initialValues={this.props.formValues}
        decorators={[formFilterFieldsDecorator]}
        validate={values => {
          const valuesObject: any = values
          const validationErrors = { errors: {} };

          if (valuesObject && valuesObject.field.password && valuesObject.field.password.length < 6){
            validationErrors.errors.field.password = "password is too short"; //errors.field.password is undefined here
          }

          return validationErrors;
        }}
        render={({
          handleSubmit,
          submitting,
          pristine,
          values,
          form,
          invalid
        }) => (
          <form onSubmit={handleSubmit}>
            <FormFilterFields
              form={form}
              onSubmit={event => this.props.onHandleSubmit(event, values)}
              onReset={event => this.props.onHandleReset(event, form)}
            />
            <pre>{JSON.stringify(values)}</pre>
          </form>
        )}
      />

那么从本质上讲，您应该如何设置字段名的错误消息，如下所示：

"field.password“

我已经查看了一些示例，但没有dice.The替代方案是字段级别的验证，这是我作为解决方案的一部分而采取的最后手段。

任何帮助都将不胜感激

谢谢

Answer 1

你试过了吗

validationErrors.errors['field.password'] = "password is too short";

编辑尝试此操作

if (!values.field || !values.field.password) {
      errors.field = {password: 'Required'};
}