Javascript 将onBlur与redux表单一起使用

我使用的是redux form 7.0.4，除了以下问题外，它工作正常

新用户可以输入详细信息，现有用户可以编辑同一表单上的详细信息。当现有用户编辑详细信息并从表单字段中删除数据时，我遇到问题。我想加上模糊检查。如果用户为空表单字段，并且存在模糊事件，我需要填充字段内的初始数据

如果字段为空，则恢复模糊上的初始/服务器值。 表单字段：

<Field
  component={InputField}
  type='text'
  name='registeredName'
  className='form-control'
  required
  placeholder='Registered Business Name*'
/>

const InputField = ({
  input,
  type,
  placeholder,
  meta: { touched, error, initial }
}) => {
  const onChange = (e) => {
    const val = e.target.value;

    if (type === 'phoneNumber') {
      if (!/^\d+$/.test(val) || String(val).length > 10) {
        return;
      }
    }

    input.onChange(e);
  };


  return (
    <div className='form-group'>
      <input
        {...input}
        onChange={onChange}
        type={type}
        className='form-control'
        placeholder={placeholder}
        value={input.value }
        onBlur={e => {input.value = (!e.target.value) ? initial : e.target.value;}}
      />
      {touched &&
       ((error &&
         <div className='error text-danger'>
           {error}
         </div>
       ))}
    </div>
  );
};
/* eslint-enable */

export default InputField;

输入字段组件：

<Field
  component={InputField}
  type='text'
  name='registeredName'
  className='form-control'
  required
  placeholder='Registered Business Name*'
/>

const InputField = ({
  input,
  type,
  placeholder,
  meta: { touched, error, initial }
}) => {
  const onChange = (e) => {
    const val = e.target.value;

    if (type === 'phoneNumber') {
      if (!/^\d+$/.test(val) || String(val).length > 10) {
        return;
      }
    }

    input.onChange(e);
  };


  return (
    <div className='form-group'>
      <input
        {...input}
        onChange={onChange}
        type={type}
        className='form-control'
        placeholder={placeholder}
        value={input.value }
        onBlur={e => {input.value = (!e.target.value) ? initial : e.target.value;}}
      />
      {touched &&
       ((error &&
         <div className='error text-danger'>
           {error}
         </div>
       ))}
    </div>
  );
};
/* eslint-enable */

export default InputField;

常量输入字段=({
输入，
类型，
占位符，
meta:{触摸，错误，初始值}
}) => {
const onChange=（e）=>{
const val=e.target.value；
如果（类型=='phoneNumber'）{
如果（！/^\d+$/.test（val）| | String（val）.length>10）{
返回；
}
}
输入。onChange（e）；
};
返回(
{input.value=（！e.target.value）？首字母：e.target.value；}
/>
{感动&&
（（错误）&&
{错误}
))}
);
};
/*eslint使能*/
导出默认输入字段；

您解决了这个问题吗？如果有，请提供解决方案？谢谢如果您不通过

发送prop

onBlur

，而是将其直接放在输入组件上，您将覆盖其事件处理程序，验证将不再工作