#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))}