如何解决这个 axios post 请求？

Question

我正在尝试将表单数据发送到后端并在服务器控制台中看到它，当我提交表单时，我在前端控制台中没有收到任何错误，但我没有看到任何信息正在发送的迹象，我哪里出错了？

 <Formik
                                initialValues={{
                                  firstName: "",
                                  lastName: "",
                                  email: "",
                                  Password: "",
                                  ConfirmPassword: "",
                                }}
                                validationSchema={SignupSchema}
                                // on submit handles here
                                onSubmit={async (values) => {
                                  console.log("logging click");
                                  const {
                                    firstName,
                                    lastName,
                                    email,
                                    Password,
                                    ConfirmPassword,
                                  } = values;
                                  const data = new FormData();

                                  data.append("firstName", firstName);
                                  data.append("lastName", lastName);
                                  data.append("email", email);
                                  data.append("Password", Password);
                               data.append("ConfirmPassword",ConfirmPassword);                        
                                  //   axios post requst to back end happens here

                                  const form = document.querySelector("form");
                                  if (form) {
                                    form.addEventListener("submit", (e) => {
                                      e.preventDefault();
                                      const FormData = new FormData(form);
                                      axios.post(
                                          "                                       
                                   "http://localhost:8080/api/admin/signup",
                                          FormData,
                                          {
                                            headers: {
                                              "Content-Type":
                                                "multipart/form-data",
                                            },
                                          }
                                        )
                                        .then((res) => {
                                          console.log(res);
                                        })
                                        .catch((err) => {
                                          console.log(err);
                                        });
                                    });
                                  }

                                  // same shape as initial values
                                }}
                              >

Answer 1

您似乎在表单提交处理中嵌套了事件侦听器和一些不必要的代码，这可能会导致问题。以下是如何使用 Axios 和 Formik 将表单数据发送到后端的简化版本：