title: onLoadEnd not firing in react native
body: <p>I am trying to display GIF from the giphy api on react native. 
  Gifs take time to display on screen so I want to display a spinner on the midtime.
  The onLoadEnd event seem to be never fired on the Image tag, so the spinner actually runs endlessly because I can never update loading in my state. What am I doing wrong here ?</p>
  
  <pre><code>import React, { Component } from 'react';
  import { View, Text, ScrollView, Image} from 'react-native';
  import axios from 'axios';
  import QuoteDetail from './quote_detail'
  import Spinner from './spinner'
  
  // class based component knows when it's gona be rendered
  class QuoteList extends Component {
    state = { quotes: [],
              giphyUrl: 'https://media.giphy.com/media/nZQIwSpCXFweQ/giphy.gif',
              loading: true
            };
  
    componentWillMount() {
      console.log('Again?')
      axios.get('https://api.tronalddump.io/search/quote?query='+this.props.characterName)
        .then(response =&gt; this.setState({ quotes: response.data._embedded.quotes }))
      this.getGiphy()
    }
  
    getGiphy() {
      console.log('getgif')
      const GiphyUrl = "https://api.giphy.com/v1/gifs/search?api_key=mBJvMPan15t7TeLs8qpyEZ7Glr5DUmgP&amp;limit=1&amp;q=" + this.props.characterName.replace(" ", "+");
      console.log(GiphyUrl)
      axios.get(GiphyUrl)
        .then(response =&gt; {
                    console.log(response)
                    console.log(response.data.data[0].url)
  
                    this.setState({ giphyUrl: response.data.data[0].images.original.url})
                    console.log(this.state)
                  })
  
    }
  
    renderQuotes() {
      return this.state.quotes.map(
        quote =&gt; &lt;QuoteDetail key={quote.quote_id} quote={quote}/&gt;
      );
    }
  
  
  
    render() {
      if (this.state.loading) {
        return &lt; Spinner /&gt;;
      }
      else {
        return (
          &lt;ScrollView&gt;
            &lt;View style={styles.viewStyle}&gt;
              &lt;Image
                source={{uri: this.state.giphyUrl}}
                key={this.state.giphyUrl}
                style={styles.gifStyle}
                onLoadEnd={() =&gt; console.log('im done loading')}
              /&gt;
              &lt;Text style={styles.vsStyle}&gt;VS&lt;/Text&gt;
              &lt;Image
                source={{ uri: "https://media.giphy.com/media/xTiTnHXbRoaZ1B1Mo8/giphy.gif"}}
                key="https://media.giphy.com/media/xTiTnHXbRoaZ1B1Mo8/giphy.gif"
                style={styles.gifStyle}
              /&gt;
            &lt;/View&gt;
            {this.renderQuotes()}
          &lt;/ScrollView&gt;
        );
      }
    }
  }
  
  const styles = {
    gifStyle: {
      height: 200,
      width: 190
    },
    viewStyle: {
      flexDirection: 'row'
    },
    vsStyle: {
      marginTop: 95,
      marginLeft: 5,
      marginRight: 5,
      fontWeight: 'bold',
      fontSize: 20
    }
  };
  
  export 
  </code></pre>
  
  <p>default QuoteList;</p>