Axios 不运行 - React JS答案

【问题标题】：Axios does not run - React JSAxios 不运行 - React JS
【发布时间】：2020-08-04 23:48:08
【问题描述】：

我正在使用axios 使用 React JS 发出 POST 请求，特别是对 Sendinblue API 的 POST 请求，发现 here。我已经使用axios 尝试了多种变体，但是我没有成功完成 POST 请求。

代码如下：

var email = this.state.value;
var data = JSON.stringify({ "listIds": [5], "email": email, "attributes": { "SMS": "sms-Number" }, "emailBlacklisted": false, "smsBlacklisted": false, "updateEnabled": true });
var config = {
     method: 'post',
     url: 'https://api.sendinblue.com/v3/contacts',
     headers: {
         'api-key': 'API-key',
          'Content-Type': 'application/json'
     },
     data: data
};

axios(config)
.then(function (response) {
     alert(JSON.stringify(response.data));
})
.catch(function (error) {
      alert(error);
});

我已经在顶部导入了axios 和所需的库。

鉴于这段代码，我在执行 axios 时永远不会收到警报。也就是说，我永远不会收到成功或错误的警报。因此，似乎它甚至没有运行 axios 部分。

关于为什么会这样的任何想法？谢谢！

【问题讨论】：

控制台有错误吗？如果您在axios(config) 之前放置一个console.log，它会被打印出来吗？
您是否在（示例）谷歌浏览器的网络选项卡上看到请求已发送到服务器？也许 axios 只是在等待超时请求
另外，尝试添加withCredentials: true 并检查是否有代理阻止您
您的代码没问题jsfiddle.net/s91j52na 错误可能发生在您未与我们共享的代码中
是的，这是未经授权/格式错误的请求错误。 Axios 工作正常，那是您返回的服务器答案，可能是因为我什至没有在我的请求中使用任何访问令牌。

标签： javascript reactjs post axios catch-block

【解决方案1】：

感谢大家的帮助。我可以通过将触发此代码的按钮放在form 标记之外来解决此错误。

旧代码（无效）：

<form>
    <TextInput></TextInput>
    <button onClick={this.runCode}>Click here</button>
</form>

新代码（有效）：

<form>
    <TextInput></TextInput>
</form>
<button onClick={this.runCode}>Click here</button>

【讨论】：