如何使用redux形式对文本输入进行验证,该形式接受长度不超过8个字符的数字?

以下是两个文件,分别是输入Form.js和TextField.js 这里TextField.js是单独的react组件,我不想更改任何内容。

这是inputForm.js文件。 在这里,我要验证输入字符并检查长度是否大于8,然后在文本输入下方应显示一些错误消息。

 import TextField from "./TextField";
 const required = value => (value ? undefined : "Required");
const exactLength = length => value => {
  //alert(value)
  return value && value.length !== length ? `Must be ${length} exact 6` : undefined;

}
  const exact6 = exactLength(6);
  
 <h2>Field-Level Validation</h2>
  <TextField
    labelName="Cost"
    placeholder="Cost"
    name="cost"
    onValidate={[required, exact6]}

  />

TextField.js

import React from "react";
import { Field, reduxForm } from "redux-form";


const Input = props => {
  const {
    disabled,
    labelName,
    placeholder,
    onValidate,
    input: { name, onBlur, onChange, onFocus, value },
    meta: { error, touched, visited }
  } = props;

  const showError = (visited || touched || onValidate) && error;
  return (
    <div className={FormStyles.inputWrapper}>
      <label className={FormStyles.formLabel}>{labelName}</label>
      <input
        className="form-input"
        disabled={disabled}
        name={name}
        onBlur={onBlur}
        onChange={onChange}
        onFocus={onFocus}
        
        placeholder={placeholder}
        value={value}
      />
      {showError && <div className="note note-error">{error}</div>}
    </div>
  );
};

const TextField = props => <Field {...props} validate={props.onValidate} component={Input} />;

export default reduxForm({
  form: "fieldLevelValidation" // a unique identifier for this form
})(TextField);