title: ReactNative - Parsing json file and display data
body: <pre><code>import React, { Component } from 'react';
  import {
    AppRegistry,
    StyleSheet,
    Text,
    View,
    Navigator,
    TouchableOpacity,
    Image,
    TouchableHighlight,
    Alert,
    TextInput
  } from 'react-native';
  import Button from 'react-native-button'
  import {Actions} from 'react-native-router-flux'
  import Home from './Home'
  
  export class Temp extends Component{
  constructor(props) {
    super(props);
     this.state = {
      data: '',
      textinput:'',
    }
     state={
              shouldShow: false
          }
  }
  
      componentDidMount(){
      this._onPressButtonGET();
    } 
  
        _onPressButtonPOST(){
          fetch("url", {
              method: "POST",  
               headers: { 
                   'Accept': 'application/json',
                   'Content-Type': 'application/json',
               },
              body: JSON.stringify({
                  "entryDate":"3/2/2017 2:00 AM", 
                  "systol": this.state.textinput,
                  "mobileType":"ANDROID",
                  "userName":"menutest",
  
                 })})
          .then((response) =&gt; response.json())
          .then((responseData) =&gt; {
              Alert.alert(
                  "Blood pressure data",
                  "Blood pressure data - " + JSON.stringify(responseData)
              )
          }).catch((error) =&gt; {
          console.error(error);
          })
          .done(); 
      }
  
      _onPressButtonGET(){
          fetch("url", {
              method: "POST",
               headers: {
                   'Accept': 'application/json',
                   'Content-Type': 'application/json',
               },
              body: JSON.stringify({"mobileType":"ANDROID","userName":"menutest"})})
          .then((response) =&gt; response.json())
          .then((responseData) =&gt; { 
  
                  this.setState({ data : JSON.stringify(responseData)})
  
              }) .catch((error) =&gt; {
          console.error(error);
        })
  
         .done();
      }
      render(){
          return(
  
              &lt;View&gt;
                  &lt;TouchableHighlight onPress={this._onPressButtonPOST.bind(this)}&gt;
                      &lt;Text&gt;Add&lt;/Text&gt; 
                  &lt;/TouchableHighlight&gt;
  
              &lt;TouchableOpacity style= {{left:300,top:-20, }}
   onPress={()=&gt;{ this.setState({ shouldShow: !this.state.shouldShow })}}
  &gt;&lt;Text&gt;Edit&lt;/Text&gt;&lt;/TouchableOpacity&gt;
  
  {this.state.shouldShow ? &lt;TextInput placeholder='systol' 
              onChangeText={(text) =&gt; this.setState({textinput: text})}
             /&gt; : null}
  
                   &lt;TouchableHighlight onPress={this._onPressButtonGET.bind(this)}&gt;
                      &lt;Text&gt;show&lt;/Text&gt;
                     &lt;/TouchableHighlight&gt;
  
                  &lt;Text&gt;{this.state.data}&lt;/Text&gt;  
              &lt;/View&gt;
      );
      }
  }
  
  
  module.exports = Temp;
  </code></pre>
  
  <p>i am developing an android app, i need to fetch data from web services that is json file. i am able to get all the, something it looks like raw data, but i need to parse that data and display only few contents.</p>
  
  <pre><code>{
  "List": [
    {
  "entryDate": "03/02/2017",
  "entryDateTime": "03/02/2017 2:00 AM",
  "entryTime": "2:00 AM",
  "systol": "120"
  },
    {
  "entryDate": "03/02/2017",
  "entryDateTime": "03/02/2017 2:00 AM",
  "entryTime": "2:00 AM",
  "systol": "121"
  },
    {
  "entryDate": "03/02/2017",
  "entryDateTime": "03/02/2017 2:00 AM",
  "entryTime": "2:00 AM",
  "systol": "120"
  },
    {
  "entryDate": "03/02/2017",
  "entryDateTime": "03/02/2017 2:00 AM",
  "entryTime": "2:00 AM",
  "systol": "122"
  },
    {
  "entryDate": "03/02/2017",
  "entryDateTime": "03/02/2017 2:00 AM",
  "entryTime": "2:00 AM",
  "systol": "123"
  }
  ]
  }
  </code></pre>
  
  <p>This is my data looks like.</p>
  
  <p>i am able to display like </p>
  
  <pre><code>{"List":[{"entryDate": "03/02/2017","entryDateTime":"03/02/2017 2:00 AM","entryTime": "2:00 AM","systol": "120"},{"entryDate": "03/02/2017", "entryDateTime": "03/02/2017 2:00 AM","entryTime": "2:00 AM","systol": "121"
  },{"entryDate": "03/02/2017","entryDateTime": "03/02/2017 2:00 AM", "entryTime": "2:00 AM","systol": "120"},{"entryDate":"03/02/2017","entryDateTime": "03/02/2017 2:00 AM","entryTime": "2:00 AM","systol": "122"},{"entryDate": 03/02/2017","entryDateTime": "03/02/2017 2:00 AM","entryTime": "2:00 AM", "systol": "123"}]}
  </code></pre>
  
  <p>but i want to display like this, only entryDate and systol</p>
  
  <pre><code>entryDate:03/02/2017
  systol:120
  entryDate:03/02/2017
  systol:121
  entryDate:03/02/2017
  systol:122
  entryDate:03/02/2017
  systol:123
  </code></pre>
  
  <p>please help me to solve this problem. Thank you</p>