使用 Formik 时出现“未捕获（承诺）类型错误：无法获取”

Question

我正在学习如何使用 Formik。我正在尝试访问通过 Postman 工作的后端，但我似乎无法使用 Formik 获取。

这是我的 onSubmit 的 App.js 代码：

            <Formik
              initialValues={{
                ...initialState,
              }}
              validationSchema={formValidation}
              onSubmit={values =>

                fetch('/api/client', {
                 method: 'POST',
                  headers: {
                'Content-Type': 'application/json'
                 },
                body: JSON.stringify(values),
                 }).then(res => res.json())}>

这是我的按钮组件代码：

const ButtonWrapper = ({
  children,
  ...otherProps
}) => {
  const { submitForm } = useFormikContext();

  const handleSubmit = () => {
    submitForm();
  };

  const configButton = {
    variant: 'contained',
    color: 'primary',
    fullWidth: true,
    onClick: handleSubmit
  };

  return (
    <Button
      {...configButton}
    >
      {children}
    </Button>
  );
};

export default ButtonWrapper;

不确定我做错了什么

Answer 1

TypeError: Failed to fetch

表示网络请求不成功。尝试打开浏览器的开发人员工具并选择“网络”选项卡。查看 React 发出的请求是否与您在 Postman 中发出的请求相匹配。另请检查开发人员控制台选项卡，因为它应该记录导致请求失败的确切错误。

浏览器在网络请求中执行其他检查，其中之一是响应标头和 CORS 或跨源请求脚本。如果 Access-Control-Allow-Origin 响应标头与本地主机站点不匹配，那么您将收到此错误。