The below code always return the below wired object
{"_U": 0, "_V": 0, "_W": null, "_X": null}
as response.
Here is my code
getData = () => {
fetch('http://192.168.64.1:3000/getAll',{
method: 'GET',
headers: {
Accept: 'application/json',
'Content-Type': 'application/json'
}
})
.then((response) => {
console.log('Response:')
console.log(response.json())
console.info('=================================')
})
.catch(err => console.error(err));
}
componentDidMount(){
this.getData();
}
I am using node, express, Mysql as backend and react-native frontend
my backend code is here
app.get('/getAll',(req,res) => {
console.log('getAll method Called');
con.query('select * from dummy',(err,results,fields) => {
if(err) throw err;
console.log('Response');
console.log(results);
res.send(results);
});
});
The above code gives correct output in console but fetch API is not.
i cant find solution for the my problem. Thanks in advance.
So the issue is that you are not waiting for your Promise to resolve and this can be solved easily.
try {
const res = await fetch(
'your_api',
);
const data = await res.json();
} catch (error) {
console.log(error);
}
That indicates that you are logging the promise before it resolves - the result of when you:
console.log(response.json())
How do I access promise callback value outside of the function?
As @Evert rightfully pointed out in comments, this is because response.json() returns a promise object.
So, you'll need to chain an additional .then() after you call response.json() where you log the resolved promise.
getData = () => {
fetch('http://192.168.64.1:3000/getAll',{
method: 'GET',
headers: {
Accept: 'application/json',
'Content-Type': 'application/json'
}
})
.then(response => response.json())
.then(data => {
console.log(data);
})
.catch(err => console.error(err));
}
Add async and await to your code:
getData = async () => {
await fetch('http://192.168.64.1:3000/getAll',{
method: 'GET',
headers: {
Accept: 'application/json',
'Content-Type': 'application/json'
}
})
.then((response) => {
console.log('Response:')
console.log(response.json())
console.info('=================================')
})
.catch(err => console.error(err));
}