Как использовать реквизиты для списка в React Native?

#image #list #react-native

#изображение #Список #react-native

Вопрос:

Я хочу взять список изображений и отправить его в другой файл, который будет использовать список для перечисления изображений.

Итак, в моем основном файле у меня есть это:

 render(){
return(
  <ScrollView>

  <View style={{flex: 1}}>
     <View>
      <ImageList images={require('./images/example1.jpg'), require('./images/example2.jpg')}/>
     </View>
  </View>

  </ScrollView>
);
  

}

Затем в другом файле у меня есть это:

 constructor(props) {
super(props);
const ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2});
this.state = {
  dataSource: ds.cloneWithRows([
    props.images
  ])
};

 }

render() {
return (
  <View>
    <ListView
      contentContainerStyle={styles.list}
      dataSource={this.state.dataSource}
      renderRow={(rowData) => <Image source={rowData} style={styles.imageSize}/>}
    />
  </View>
);
  

}

Проблема в том, что отображается только одно из изображений. Я хочу, чтобы отображались все изображения.

Я попытался преобразовать его в массив:

   <ImageList images={[require('./images/example1.jpg'), require('./images/example2.jpg')]}/>
  

Но я получаю сообщение об ошибке, в котором говорится:

 JSON value '1' of type NSNumber cannot be converted to an image. Did you forget to call resolveAssetSource() on the JS side? 
  

Внесено изменение на основе предложения @Siou.

 this.state = {dataSource: ds.cloneWithRows(props.images)};
  

Но я получил сообщение об ошибке:

 undefined is not an object (evaluating 'Object.keys(dataBlob[sectionID])')
  

Комментарии:

1. props.images — это правильный массив?

2. Да, это массив

Ответ №1:

Как указано в ошибке, вам необходимо разрешить источник ресурсов:

 import {Image} from 'react-native'
Image.resolveAssetSource(asset)
  

Для массива:

 images={images.map(image => Image.resolveAssetSource(image))}