title: React Native giving the error: TypeError: undefined is not an object (evaluating 'item.enclosures[0].url')
body: <p>I have been having this problem, that I think is related to slow fetching.
  I fetch from itunes API to get podcasts for this app I build.
  on some podcasts it manages to work, but on others it shows that message,
  Here is the error:</p>
  <p>Error image:</p>
  <p><a href="https://i.stack.imgur.com/tMmhP.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/tMmhP.png" alt="enter image description here" /></a></p>
  <p>Here is my code:</p>
  <p>EpisodesView.tsx:</p>
  <pre class="lang-js prettyprint-override"><code>import React, { useState, useEffect } from 'react';
  import { ScrollView, Text } from 'react-native';
  import { observer } from &quot;mobx-react&quot;;
  //components
  import Episode from './Episode';
  import { useRootStore } from '../contexts/RootStoreContext';
  import BottomGap from './BottomGap';
  import PodcastTitle from './PodcastTitle';
  import PodcastImage from './PodcastImage';
  import SubscribeIcon from './SubscribeIcon';
  import { fetchPodcast } from '../Api/Fetches';
  
  //shows all of the episodes of a certain podcast
  const EpisodesView = ({ route, navigation }) =&gt;{ 
       //a constant to tell the &lt;Episode /&gt; what page he is on
       const fromMyListScreen = false;  
      // const { cachingStore } = useRootStore();
     
      const [podcast, setPodcast] = useState({
          title:'',
          image: undefined,
          description: '',
      })
      const [rss, setRss ] = useState();
  
      useEffect(() =&gt; {
          //fetch podcast
          fetchPodcast(route.params.rssUrl)
              .then((rss) =&gt; {
                  setRss(rss);
              })
              .catch((err)=&gt;{
                  console.log(err)
              })
      })
      
      //show all episodes of the podcast
      const showEpisodes = () =&gt; {
          return rss.items.map(item =&gt; {
              var track = {
                  id: item.id,
                  url: item.enclosures[0].url,
                  title: item.title,
                  artwork: item.itunes.image ,
                  artist: rss.title,
                  description: item.description,
                  duration: item.itunes.duration,
                  rssUrl: route.params.rssUrl,
              }
              return (
                  &lt;Episode track={track} key={track.id} fromMyListScreen={fromMyListScreen} /&gt;
              );
          })
  
      }
      var showTitle = rss?(
          &lt;PodcastTitle title= {rss.title}/&gt;
      ):(
          undefined
      )
  
      var showImage = rss? (
          &lt;PodcastImage image={rss.itunes.image}/&gt;
      ):(
          undefined
      )
  
      return (      
          &lt;ScrollView&gt;      
            {showTitle}
             {showImage}
             &lt;SubscribeIcon /&gt;
              &lt;Text style={{ paddingTop:20,paddingBottom:20}}&gt;{podcast.description}&lt;/Text&gt;           
              {rss? showEpisodes(): undefined}
             &lt;BottomGap /&gt;
          &lt;/ScrollView &gt;
      )
  };
  
  export default observer(EpisodesView);
  </code></pre>
  <p>the file where i fetch:
  Fetches.ts:</p>
  <pre class="lang-js prettyprint-override"><code>//fetches a specific podcast
  export const fetchPodcast = (url) =&gt;{   
      return fetch(url)
      .then((response) =&gt; {
          return response.text()
      })
      .then((data) =&gt; {
           return rssParser.parse(data)
       })
      .then((rss) =&gt; {
          return rss;
      })
       .catch(err =&gt; {
          console.log(err);
      });
  };
  </code></pre>
  <p>I must say that it does exist,and not undefined, checking with console.log + postman
  btw,
  when doing this:</p>
  <pre class="lang-js prettyprint-override"><code>var track = {
      id: item.id,
      //url: item.enclosures[0].url,
      title: item.title,
      artwork: item.itunes.image ,
      artist: rss.title,
      description: item.description,
      duration: item.itunes.duration,
      rssUrl: route.params.rssUrl,
  }
  </code></pre>
  <p>it gives another problem, with another function thatrenders the duration,
  so I believe it just doesn't manage to fetch it all before rendering
  (btw it is the podcast 'syntax')</p>
  <p>Do you have a solution?
  thank you</p>