ReactJS axios对PHP的POST调用-请求异常终止错误

时间:2020-04-08 14:45:11

标签: reactjs axios

我正在尝试使用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通话有问题吗?我只是从一个可以正常工作的组件复制/粘贴了它,并且那里没有问题。

1 个答案:

答案 0 :(得分:0)

该方法在onClick的“提交”按钮onClick上调用,这迫使页面在请求完成之前重新加载。

将其移至表单

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

并将事件作为参数添加到loginHandler和这行代码

event.preventDefault(); 

让它最终可以工作。