Formik在页面刷新时调用onBlur进行输入

import React from "react";
import { Formik, Field, ErrorMessage } from "formik";

const validateUsername = (value) => {
  let error;
  if (!value) {
    error = "用户名不能为空";
  }
  return error;
};

const App = () => {
  return (
    <Formik
      initialValues={{ username: "" }}
      onSubmit={(values) => {
        // 处理表单提交
        console.log(values);
      }}
    >
      {({ handleSubmit }) => (
        <form onSubmit={handleSubmit}>
          <div>
            <label htmlFor="username">用户名：</label>
            <Field
              type="text"
              id="username"
              name="username"
              onBlur={(e) => {
                // 在失去焦点时进行验证
                e.target.onBlur();
              }}
              validate={validateUsername}
            />
            <ErrorMessage name="username" component="div" />
          </div>
          <button type="submit">提交</button>
        </form>
      )}
    </Formik>
  );
};

export default App;