redux - 如何不以 redux 形式在验证函数中返回字符串

Question

我有一个带有输入字段和同步验证的表单。同步验证将产生错误消息，错误消息将显示在输入字段下方。

但是，在某些情况下，我只希望输入字段具有红色边框而没有错误消息。我尝试使用字段级验证。

import {validateDateString} from "some/path";

const renderField = ({input, value, meta: {touched, asyncValidating, error, valid}}) => {
        return (
            <div className=`${validateDateString(input.value) ? '': 'border-error'}`>
                <input type="text" {...input}/>
                {touched && error && <div className="form-group__error">{error}</div>}
            </div>
        );
};

const validate = (dateString) => {
   if(validateDateString(dateString)) return undefined;
   return false; 
}

然后我的领域看起来像这样：

  <Field
        name={"myName"}
        component={renderField}
        validate={validate}
    />

在字段级验证上，我不希望显示错误消息，只在同步验证中。因此我不想在我的validate函数中返回一个字符串，因为该字符串将显示在输入字段下方。文档说它不一定是字符串，所以我要返回false：

如果该值无效，则验证函数应返回错误。这通常是一个字符串，但不是必须的。

但似乎不起作用：表单仍在提交中。我在验证功能中做错了什么，还是有另一种方法可以防止手动提交表单？

标签： reduxreact-reduxredux-form