up vote 3 down vote favorite

I am trying to make an app that displays quotes from a famous person (e.g. Bob Dylan) using the wiki quote api.

The request url looks like this:

https://en.wikiquote.org/w/api.php?format=json&action=parse&page=Bob_Dylan&prop=text

I have the React Native request working with:

componentWillMount() {
Api().then((response) => {
  this.setState({
    quote:response.parse.text

  })

});
}

When I try to display the quote, however, it is in the form of an object and get [object object] in the view. In the console I receive:

Possible Unhandled Promise Rejection (id: 0): Objects are not valid as a React child (found: object with keys {}). If you meant to render a collection of children, use an array instead or wrap the object using createFragment(object) from the React add-ons. Check the render method of Text. Invariant Violation: Objects are not valid as a React child (found: object with keys {}). If you meant to render a collection of children, use an array instead or wrap the object using createFragment(object) from the React add-ons. Check the render method of Text.

When I try response.parse.text.* I receive a token error. Any suggestions how to fix this ?

share|improve this question
1  
response.parse.text['*'] .. * is a special character – azium Jun 30 '16 at 20:14
up vote 2 down vote

You have to explicitly turn response into Object , by calling its json() method, like:

 var url = 'https://en.wikiquote.org/w/api.php?format=json&action=parse&page=Bob_Dylan&prop=text';

 fetch(url)
   .then((response) => response.json())
   .catch((error) => console.warn("fetch error:", error))
   .then((response) => console.log(response.parse))

Working example: https://rnplay.org/apps/EqyMdA

share|improve this answer
up vote 0 down vote

You can use response.text() instead of response.json()

var url = 'https://en.wikiquote.org/w/api.php?
 fetch(url)
   .then((response) => response.text())
   .catch((error) => console.warn("fetch error:", error))
   .then((response) => console.log(response.parse))
share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.