ReactJS axios POST 调用 PHP - 请求中止错误答案

【问题标题】：ReactJS axios POST call to PHP - Request Aborted errorReactJS axios POST 调用 PHP - 请求中止错误
【发布时间】：2020-04-08 14:45:11
【问题描述】：

我正在尝试使用 axios 对 PHP 文件进行 POST 调用。

 loginHandler = () => {

    var params = new URLSearchParams();
    params.append('User', this.state.inputUsername);
    params.append('Pwd', this.state.inputPassword);

    var callAction =  process.env.REACT_APP_API_ENDPOINT + 'LoginHandler.php';

    axios.post(callAction, params)
    .then(res => {
        const message = res.data;
        console.log(message);
    })
    .catch(function (error) {
        // handle error
        console.log(error);
      })
  }

但我尝试的一切似乎都给了我一个“请求中止”的错误。但是，从除 LoginForm 组件之外的任何其他组件执行 axios 请求似乎都有效。

我的 axios 调用有什么问题吗？我只是从一个有效的组件中复制/粘贴它，它在那里没有问题。

【问题讨论】：

你试过把参数放在json axios.post(callAction, { User: this.state.inputUsername, Pwd: this.state.inputPassword })
@YatinGaikwad 是的，我试过了，我得到了同样的错误。认为发布整个文件会有帮助吗？

标签： reactjs axios

【解决方案1】：

在“提交”按钮 onClick 上调用了该方法，这会在请求完成之前强制页面重新加载。

将其移至表单

 <form onSubmit ={(event) => this.loginHandler(event)} >

并在loginHandler上添加事件作为参数，以及这行代码

event.preventDefault();

终于搞定了。

【讨论】：