我正在尝试通过reactjs中的fetch
发出POST请求。我浏览了一些文档,但我的错误没有解决。任何人都可以帮帮我吗?
这是我的reactjs代码:
handleSubmit(e) {
e.preventDefault();
var self = this;
const payload = {
id: 111,
studentName: 'param',
age: 24,
emailId: 2
};
fetch({
method: 'POST',
url: 'http://localhost:8083/students',
body: payload,
headers: {
'Content-Type': 'application/json',
'Accept': 'application/json'
}
})
.then(function(response) {
return response.json()
}).then(function(body) {
console.log(body);
});
}
}
如果有人熟悉reactjs,只需举一个简单的例子来说明如何调用post请求。使用fetch
或axios
。
答案 0 :(得分:0)
这是一个例子..
fetch('http://myAPiURL.io/login',{
method:'POST',
headers:{
'Content-Type': 'application/json',
'Accept': 'application/json'
},
body:JSON.stringify({
email: userName,
password: password
})
}).then(function (response) {
//Check if response is 200(OK)
if(response.ok) {
alert("welcome ");
}
//if not throw an error to be handled in catch block
throw new Error(response);
})
.catch(function (error) {
//Handle error
console.log(error);
});
for more info on how to use `fetch` https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch
答案 1 :(得分:0)
我刚刚回答了类似的问题。 here
React的优点在于它只是Javascript。
所以你需要的是做服务器的POST!
使用两者的例子可能是:
// Using ES7 async/await
const post_data = { firstname: 'blabla', etc....};
const res = await fetch('localhost:3000/post_url', { method: 'POST', body: post_data });
const json = await res.json();
// Using normal promises
const post_data = { firstname: 'blabla', etc....};
fetch('localhost:3000/post_url', { method: 'POST', body: post_data })
.then(function (res) { return res.json(); })
.then(function (json) { console.log(json); };
// AXIOS example straight from their Github
axios.post('/user', {
firstName: 'Fred',
lastName: 'Flintstone'
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});