Skip to content Skip to sidebar Skip to footer

React-native Rendering Multiple Images

I am trying to render multiple images from marvels api. Here is a example: 'images': [ { 'path': 'http://i.annihil.us/u/prod/marvel/i/mg/e/00/52264475c3499',

Solution 1:

Hej fætter! ;)

I think your problem is, that you aren't using the ListView the right way. Have a look at the docs on the react-native website: http://facebook.github.io/react-native/docs/listview.html#listview

You probably want to do something like:

constructor(props) {
  const imgsrc = newListView.DataSource({ rowHasChanged: (img1, img2) => img1.path !== img2.path })
  this.state = {
    imageSource: imgsrc.cloneWithRows(props.comic.images)
  }
}
... // In render function
<View>
  <ListViewdataSource={this.state.imageSource}renderRow={image =><Imagesource={{uri:image.path}} style={styles.Images} />}
  />
</View>
...

This may look at bit strange when coming from a background in webdevelopment, but it's necessary to make the scroll-experience smooth.

See you! Anders

Post a Comment for "React-native Rendering Multiple Images"