如何使用使用axiox上reactjs 我建立一个简单的待办事项应用反应

Question

如何POST请求爱可信发布请求。我使用MongoDB的和的NodeJS为后端和reactjs为前端。 现在我需要知道如何post request using axiox on reactjs。因为我想将所有数据存储在我的服务器上。我为此做了一个crud api。如何使用使用<strong>axiox</strong>上<strong>reactjs</strong></p> <p>我建立一个简单的<strong>待办事项应用</strong>反应

谢谢:)

Answer 1

我假设你提的，而不是axiox

首先你需要axios的方法之一是使用NPM，安装其从终端/ Windows的一个开发依赖于安装爱可信

npm install --save-dev axios 

请务必在您使用axios的地方添加axios。

import axios from 'axios'; 

那么你可以使用任何你想要使用axios的请求。下面是从axios npm documentation代码（GET请求），

axios.get('url') 
    .then(function (response) { 
    // You can do whatever you want to do with the response 
    }) 

请务必添加捕获错误：

.catch(function (error) { 
    console.log(error); 
    }); 

你可以阅读更多关于axios documentation

如果您想了解更多约axios去这里Medium

Answer 2

这需要一个更详细的答案。就像当你使用箭头功能如发生了什么..

axios.get('my/api/names') 
     .then(function (response) { 
// you get back an object with config,data,headers,request,status,statusText 
// the api im currently working with hands out an array for the data bit of 
//the object then i can loop the data and use it whatever way i want. 
     response.data.forEach(item => {console.log(item)} 
     }) 

我不是100％的这实际上是如何工作的，但使用的关键词“那么”它只是你的标准的承诺，当你以后再（）其良好的有一个then.catch（err => {console.log（err）}），所以它使调试更容易。响应以对象的形式传递给函数，以便您可以使用。符号来访问该对象中的各种事物。我用axios挣扎了一下，我一直在阅读它，但在某些情况下需要{data}这样的一些奇怪的规则。我希望有人提出一个更好的答案。 axios是一个非常好的工具，当你有很多API请求同时发生时，它确实有用。您可以使用axios.all（）在同一时间

axios.all(myArray.map(myArr => axios.get('/domain/thing/${myArr.names}/names'))) 

这段代码只是将在同一时间，可以在某些情况下方便您的所有要求做的所有请求。继续阅读文档并尝试一下。我发现将断点放入并观察请求在Chrome中的Network选项卡中查看以及在Sources选项卡中查看代码的解释方式以及观察值逐行更改很有用。在React中使用的一个好工具是MobX，它只是一个状态管理工具，它非常有趣，并且在eggheads.io上有一个很好的课程，德国人很好地解释了一些事情。祝您好运React