React-Redux，Yup和Formik的表单验证问题

Question

当我尝试使用Formik和Redux使用Yup验证输入数据时遇到问题。在Redux之前，它工作得很好，但是自从我使用Redux扩展了应用程序以来，Yup的行为就好像输入中没有数据，但是它在那里。我将代码减少为“仅一个输入”，但是每3个输入都具有相同的行为

img

    import CustomTextField from "./CustomTextField";
    import { validationSchema } from "./schemas/schemas";


    const MainForm: React.FC = () => {
      const formValue = useSelector((state: any) => state.form);
      const dispatch = useDispatch();

    return (
    <div>
      <Formik
        initialValues={{...}}
        validationSchema={validationSchema}
        onSubmit={() => {
          dispatch(isFormSaved(true));
        }}
      >
        {({ isSubmitting }) => (
          <Form style={{ display: "flex", flexDirection: "column" }}>
            <CustomTextField
              placeholder="Title"
              name="title"
              type="input"
              value={formValue.title}
            />
            <Button disabled={isSubmitting} type="submit">
              Submit
            </Button>
          </Form>
        )}
      </Formik>
    </div>
    );
    };

    export default MainForm;

和customTextField：

const CustomTextField: React.FC<FieldAttributes<{}>> = ({
  placeholder,
  ...props
}) => {


  const [field, meta] = useField<{}>(props);
  const errorText = meta.error && meta.touched ? meta.error : "";
  const dispatch = useDispatch();

  return (
    <TextField
      placeholder={placeholder}
      {...field}
      helperText={errorText}
      error={!!errorText}
      value={props.value}
      onChange={(event: SyntheticEvent) => {
        dispatch(saveForm(event));
    }}
    ></TextField>
  );
};

export default CustomTextField;