为什么我的React Text组件没有显示文本？ （反应360）

Question

I have the following code in React:

  export class CryptoInformation extends React.Component {


  state = {
    cryptoInformation: {}
  }

  componentDidMount() {
    fetch('https://api.coinmarketcap.com/v2/ticker/1/')
    .then(response => response.json())
    .then(response => {
      this.setState({cryptoInformation: response["data"]});
    })
    .then(response => {

      #########This logs to the console 'Bitcoin'#######
      console.log(this.state.cryptoInformation.name);


    })
  }

  render() {
    return (
      <View>

        ######## Why is this not showing 'Bitcoin' #######
        <Text>{this.state.cryptoInformation.name}</Text>
      </View>
    )
  }
}

The API works perfectly and I am able to get the information I need to be stored in my cryptoInformation object. However, when I try to display the name portion of the JSON, I get nothing for the Text. Why is this so? This should be straightforward. Am I presenting the data wrong? Help would be appreciated. Thanks.

----Edit----

The data that is returned has the following structure:

{
"data": {
    "id": 1, 
    "name": "Bitcoin", 
    "symbol": "BTC", 
    "website_slug": "bitcoin", 
    "rank": 1, 
    "circulating_supply": 17008162.0, 
    "total_supply": 17008162.0, 
    "max_supply": 21000000.0, 
    "quotes": {
        "USD": {
            "price": 9024.09, 
            "volume_24h": 8765400000.0, 
            "market_cap": 153483184623.0, 
            "percent_change_1h": -2.31, 
            "percent_change_24h": -4.18, 
            "percent_change_7d": -0.47
        }
    }, 
    "last_updated": 1525137271
},
"metadata": {
    "timestamp": 1525237332, 
    "error": null
}

}

Also, I have no errors as I can see the data structure in the console.

-----EDIT----

I left out a major detail. I am actually using React 360 for creating a Vr web page. Sorry for leaving that out.

Answer 1

I have tried the same way but not getting any error, its working as expected.

Only thing i have changed is am using <div> insted <View> , <h1> instead of <Text> . since its a react app.

You have to check weather are you importing this file correctly or not.

 class CryptoInformation extends React.Component { state = { cryptoInformation: {} } componentDidMount() { fetch('https://api.coinmarketcap.com/v2/ticker/1/') .then(response => response.json()) .then(response => { this.setState({cryptoInformation: response["data"]}); }) .then(response => { console.log(this.state.cryptoInformation.name); }) } render() { return ( <div> <h1>{this.state.cryptoInformation.name}</h1> </div> ) } } ReactDOM.render( <CryptoInformation/>, document.getElementById("root") ); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script> <div id="root"></div>