无法将错误从API响应传递到Formik错误显示

import { Formik, Form, ErrorMessage } from 'formik';

const MyForm = () => {
  const handleSubmit = async (values, { setError }) => {
    try {
      const response = await fetch('api-url', {
        method: 'POST',
        body: JSON.stringify(values),
      });
      
      if (!response.ok) {
        const errorData = await response.json();
        const errorMessage = errorData.message; // 从响应中提取错误信息
        setError(errorMessage); // 将错误信息传递给Formik的setError函数
      } else {
        // 处理其他逻辑
      }
    } catch (error) {
      console.error(error);
    }
  };

  return (
    <Formik initialValues={{}} onSubmit={handleSubmit}>
      <Form>
        <div>
          <label htmlFor="name">Name</label>
          <input type="text" name="name" />
          <ErrorMessage name="name" component="div" />
        </div>
        
        <button type="submit">Submit</button>
      </Form>
    </Formik>
  );
};

export default MyForm;