title: React-Native: Display JSON Data in ListView
body: <p>I want to display JSON-Data in a ListView. The Problem is, that the JSON data contains Dictionaries. 
  In one Row I would like to display 'Gattung', 'ab' and 'bis'.
  I am not able to display following JSON-Data in a ListView:</p>
  
  <pre><code>[
  {
      "Gattung": "ICE",
      "Zugummer": 26,
      "ab": "Regensburg Hbf",
      "bis": "Hanau Hbf",
      "Wochentag": "Fr",
      "Zeitraum": ""
  },
  {
      "Gattung": "ICE",
      "Zugummer": 27,
      "ab": "Frankfurt(Main)Hbf",
      "bis": "Regensburg Hbf",
      "Wochentag": "So",
      "Zeitraum": ""
  },
  {
      "Gattung": "ICE",
      "Zugummer": 28,
      "ab": "Regensburg Hbf",
      "bis": "WÃ¼rzburg Hbf",
      "Wochentag": "Fr",
      "Zeitraum": ""
  },
  {
      "Gattung": "ICE",
      "Zugummer": 35,
      "ab": "Hamburg Hbf",
      "bis": "Puttgarden",
      "Wochentag": "tgl.",
      "Zeitraum": "25.06. - 04.09."
  },
  {
      "Gattung": "ICE",
      "Zugummer": 36,
      "ab": "Puttgarden",
      "bis": "Hamburg Hbf",
      "Wochentag": "tgl.",
      "Zeitraum": "25.06. - 04.09."
  }
  ]
  </code></pre>
  
  <p>This is my code now:</p>
  
  <pre><code> var ds = new ListView.DataSource({rowHasChanged: (r1, r2) =&gt; r1 !== r2});
  
  
  var MainView = React.createClass ({
  
  
  
  
  
    getInitialState() {
  
       return {
  
          jsonURL: 'http://demo.morgenrot-wolf.de/qubidu/test.json',
          dataSource: ds.cloneWithRows(['row 1', 'row 2']),
       }
     },
  
  
  
     componentDidMount(){
  
        this.loadJSONData();
  
     },
  
  
  
     loadJSONData() {
  
       fetch(this.state.jsonURL, {method: "GET"})
       .then((response) =&gt; response.json())
       .then((responseData) =&gt;
       {
            for (var i = 0; i &lt; responseData.length; i++)
            {
  
  
                this.setState({ dataSource: this.state.dataSource.cloneWithRows(responseData[i]) });
            }
  
       })
       .done(() =&gt; {
  
  
       });
  
  
     },
  
  
  
  
    render() {
      return (
  
        &lt;View style={styles.container}&gt;
  
           &lt;ListView
                dataSource={this.state.dataSource}
                renderRow={(rowData) =&gt; &lt;Text&gt;{rowData}&lt;/Text&gt;}
              /&gt;
        &lt;/View&gt;
  
      );
    }
  });
  </code></pre>