title: Is there any way to access the array of objects properties in react-native?
body: <p>I'm new to the react-native programming. What I find more difficult is accessing the array of objects in react-native. I'm working on a simple react-native app, I had made a localhost server request but in the server response, I'm getting the array of objects. I tried accessing those array of the object using normal JavaScript period operator. But, I don't allow us to access those Object.</p>
  
  <blockquote>
    <p>Property which I gonna access within the array of objects shown in below picture.
    <a href="https://i.stack.imgur.com/Kuddi.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Kuddi.png" alt="enter image description here"></a></p>
  </blockquote>
  
  <p>Here, I go with localhost server request</p>
  
  <pre><code> export default class Gallery extends Component{
    constructor(props){
      super(props);
      this.state = {
        data: []
      }
    }
  
    componentWillMount(){
      fetch('http://139.162.27.183:8080/Eshiksha/org/'+this.props.orgId+'/branch/'+this.props.branchId+'/videourl/videourls', { 'method' : 'GET', 
            headers: {
              'Content-Type' : 'application/json',
              'Authorization' : this.props.auth
            }
       })
      .then((response) =&gt; response.json())
      .then((responseData) =&gt; {
        this.setState({ data: responseData });
        console.log(this.state.data.videoUrls[4]); // Using Remote JS Debugging i consoled out following array of object it's shown. But same code (this.state.data.videoUrls[4]) not being accessed within the render function.
      })
      .done();
    }
  
      render(){
          return(
          &lt;ScrollView&gt;
              &lt;View style={styles.container}&gt;
                  &lt;View style={styles.card}&gt;
                    &lt;View style={styles.button}&gt;
                      &lt;Text style={styles.buttonText}&gt;{this.state.data.videoUrls[4].eventName}&lt;/Text&gt; // Here, I'm getting error which is shown below image
                    &lt;/View&gt;
                  &lt;TouchableOpacity&gt;
                    &lt;View style={styles.button}&gt;
                      &lt;Image style={styles.image} source={require('./school.jpg')} /&gt;
                    &lt;/View&gt;
                  &lt;/TouchableOpacity&gt;
                  &lt;/View&gt;
              &lt;/View&gt;
          &lt;/ScrollView&gt;
          );
      }
  }
  </code></pre>
  
  <p>Within the react-native render() function I'm trying to access those array of objects within the server response data. Here, I'm getting the following error which is shown in below picture.
  <a href="https://i.stack.imgur.com/eYrU6.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/eYrU6.png" alt="enter image description here"></a></p>
  
  <p>Please help me to find a solution to access those array of object property in react-native. Thanks in advance...</p>