显示通过API返回的错误-React Final Form

我试图显示通过API返回的每个无效字段的内联错误。我遵循的提交错误的例子 here 像这样:

const handleSubmit = async (values) => {
  let errors;

  await createProduct(values) // axios.post(...)
    .then((res) => ...)
    .catch((error) => {
      errors = error.response.data.errors;
      console.log(errors); // returns { title: ["can't be blank"] }
    });

  return errors; // returns { title: ["can't be blank"] }
}

   <Form onSubmit={handleSubmit}>
        {({
          submitError,
          handleSubmit,
          ...
        }) => (
          <BSForm onSubmit={handleSubmit}> // BSForm for boostrapform
            {submitError && (
              <div className="error">{submitError}</div> // not showing
            )}
            {console.log(submitError)} // returns 'undefined'
            <TextField
              name="title"
              ...
            />

我只能调用 submitError {[FORM_ERROR]: 'error message'} 而不是退回 errors 目标。

我希望能够将这些API错误传递到相应的字段中 meta: { error } 道具,但我完全可以忍受 顺从的恐怖 正在包装API错误。