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:

.php?format=json&action=parse&page=Bob_Dylan&prop=text

I have the React Native request working with:

ponentWillMount() {
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 ?

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/w/api.php?format=json&action=parse&page=Bob_Dylan&prop=text

I have the React Native request working with:

ponentWillMount() {
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 ?

• javascript
• json
• reactjs
• react-native

Share Improve this question Follow edited Jun 30, 2016 at 20:07 Nathaniel Ford 21.3k2020 gold badges9696 silver badges110110 bronze badges asked Jun 30, 2016 at 20:05 crodcrod 24533 gold badges55 silver badges1212 bronze badges 1

• 1 response.parse.text['*'] .. * is a special character – azium Commented Jun 30, 2016 at 20:14

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 3

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

 var url = 'https://en.wikiquote/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/apps/EqyMdA

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

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