Reputation: 3606
I have React component FetchQoute which is supposed to get response from the provided URL, but it shows undefined instead ?
class FetchQuote extends Component {
constructor(props) {
super(props);
this.state = {
jokes: []
};
}
componentDidMount() {
console.log(res.value); //undefined
axios.get('https://api.icndb.com/jokes/random')
.then((res) => {
this.setState({data:res.value.joke});//error TypeError: Cannot read property 'joke' of undefined
})
}
}
That URL can be easily tested in browser to return JSON data correctly, including res.value.joke
Upvotes: 0
Views: 12770
Reputation: 2099
What's the JSON response look like in the browser? axios returns response data under the data attribute.
For example if your JSON response looks like:
{ "value":
{ "joke": "lol"}
}
Then you would access it like
axios.get('https://api.icndb.com/jokes/random')
.then((response) => {
console.log(response.data.value.joke);
})
Upvotes: 3