将获取 "post" 请求移动到单独的文件

Question

你能告诉我是否可以在单独的文件中提出“post”请求吗？我用文件“api.js”创建了一个文件夹，并将“get”请求放在那里，我想知道如何发出“post”请求（如果可能）。

例如，将此代码放入“api.js”文件中。

const handleSubmit = async (event: SyntheticEvent) => {
    event.persist();
    event.preventDefault();

    await fetch(process.env.REACT_APP_API + "account/register", {
      method: "POST",
      headers: {
        Accept: "application/json",
        "Content-Type": "application/json",
      },

      body: JSON.stringify({
        Name: event.target.Name.value,
        Email: event.target.Email.value,
        Phone: event.target.Phone.value,
        Password: event.target.Password.value,
        PasswordConfirm: event.target.PasswordConfirm.value,
        RememberMe: RememberMe,
        UserRole: Roles,
      }),
    })
      .then((res) => res.json())
      .then(
        (result) => {
          console.log(result);
        },
        (error) => {
          alert("Error");
        }
      ); 

    setRegister(true);
  };

Answer 1

是的，这是可能的，您只需要确保执行 API 调用的函数正在返回结果。然后从新文件导出函数。

完成后，您可以将其导入到您要使用它的函数中，并在那里等待您的结果。我在这里做了一个小演示，希望对您有所帮助：

https://codesandbox.io/s/inspiring-meitner-g5otf

一种更简洁的方法可能是使用 React Hooks 并更新全局上下文，但根据您的需要，上述方法应该可行。

将获取 "post" 请求移动到单独的文件

Moving fetch "post" request to a separate file

api

post

fetch

reactjs