React axios post 请求不发送数据

Question

我正在为我的应用程序使用 React。我正在学习 post 请求。我找到了一个虚拟 api 站点 Mocky where I can test my post request. This is my api link。对于 post 请求，我使用了 axios。我不知道 Mocky api 是如何工作的。我提出了 post 请求。当我控制台记录输入值时，我可以 value.But 当我控制台记录响应时，它似乎没有获取数据。我没有看到任何错误的地方。

这是我的代码：

import React, { useState } from 'react';
import { API_URLS } from '../utilities';
import axios from "axios";
export default function CreateAccount() {
  const [state, setState] = useState({
    "email": ``,
    "password": ``,
    "loading": false,
    "error": ``
  });
  const onChangeStudent = (e) => {
    setState({
      ...state,
      [e.target.id]: e.target.value
    });
  };

  const onSubmit = async (e) => {
    e.preventDefault();
    console.log(state);
    const url = `https://run.mocky.io/v3/15c2b7ec-9f31-4a18-ae60-a7f41e1f39b2`;
    const obj = {
      "email": state.email,
      "password": state.password
    };
    console.log(obj.email); //I can see the input value
    console.log(obj.password);//I can see the input value
    axios
      .post(url, obj)
      .then((res) => {
        console.log(res.data); // it does not show the data
        console.log(res);
      })
      .catch((error) => {
        setState({
          ...state,
          "error": error
        });
      });
  };

  return (
    <div>
      <form onSubmit={onSubmit}>
        <input
          type="text"
          value={state.name}
          onChange={onChangeStudent}
          id="email"
          required
        />
        <input
          type="password"
          value={state.password}
          onChange={onChangeStudent}
          id="password"
          required
        />
        <button
          className="btn waves-effect blue lighten-1"
          type="submit"
          name="action"
          disabled={state.loading}
        >
          {state.loading ? `loading...` : `save`}
        </button>
      </form>
    </div>
  );
}

Answer 1

嗨，您似乎找不到任何问题。

我测试了以下内容，它对我有用。尝试将 .then 更改为 await。希望这能解决您的问题。如果您的请求成功并且您正在发送正文，请检查您的网络选项卡。

try {
       const response = await axios.post('https://run.mocky.io/v3/4b95050f-2bcc-4c78-b86e-6cac09372dce', data);
       console.log("Response", response);
     } catch(e) {
         console.error(e);
     }

React axios post 请求不发送数据

React axios post request does not send the data

http-post

reactjs

axios