React native detect loading image -

i have problem. use onload, onloadstart , onloadend in image. want wait while server response link image , show image, add loading. jerking constantly.

  constructor (props) {     super(props)     this.state = {loading: true}}      return(      <image         onload={(e) => this.setstate({loading: true})}         onerror={(e) => this.setstate({loading: false})}         onloadstart={(e) => this.setstate({loading: false})}          source={this.state.loading ? require('../../img/loading.gif') : {           uri: getbesturl(artwork)}}         style={styles.artworkimage}         resizemode={image.resizemode.cover}       />) 

are returning image constructor or didn't post code?

now question, think won't work way since seems change state while it's loading 'loading.gif' or uri image. setting height , weight image? needed can see in docs

unlike static resources, need manually specify dimensions of image.

https://facebook.github.io/react-native/docs/images.html#network-images

maybe can store image path in state , make conditional rendering according state value. example:

... this.state = { imagepath: null, } ...  this.setstate({ imagepath: getbesturl(artwork); }); ...  { this.state.imagepath ? <image uri={require(this.state.imagepath)} /> : <image uri={require('loading.gif')} } 

consider code above example express idea.

hope can worth you.