Доступ к значению массива избыточного хранилища в плоском списке

Question

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

Это мое начальное состояние

var InitialState = Record({
    query : null,
    searchResults: new (Record({
        total: null,
        lastPage: null,
        items : [],
        perPage : null,
        currentPage : null,
        nextPageUrl: null,
        prevPageUrl:null,
    }))(),
})

Массив items выглядит следующим образом

[ { id: 1050,
user_id: null,
name: 'Item A',
description: null,
image :
{
   id : 150,
   filename : 'imageA.jpg'
}
},
{ id : 1051,
user_id: null,
name: 'Item A',
description: null,
image :
{
   id : 152,
   filename : 'imageB.jpg'
}
},
......
]

Это мой плоский список для отображения изображения

<View>
       ...
        <FlatList
          data={this.props.search.searchResults.items}
          renderItem={({item, index}) => this._renderItemInfo(item)}
          keyExtractor={(item, index) => item.id.toString()}
        />
      </View>

Это функция renderItemInfo

_renderItemInfo(item, index){
    return(
      <View style={styles.resultBox}>
      <View style={{flex:1, flexDirection: 'row'}}>
        <Image
          style={{width: 100, height: 100}}
          source={{uri: 'https://www.somewebsite.com/image/'+ this.props.search.searchResults.items[0].image.filename}}
        />
        <Text id={item.id} style={{paddingLeft:5}}>{item.id} {item.name}</Text>
      </View>
        <Divider/>
      </View>
    )
  }

На источник изображения, Как я могу получить доступ ко всем файлам?

this.props.search.searchResults.items[0].image.filename

Это только доступ к первому массиву.

Если я добавлю индекс к ключу массива

this.props.search.searchResults.items[index].image.filename

Это выдаст эту ошибку

TypeError: TypeError: null не является объектом (оценивая это).props.search.searchResults.items [index] .image.filename ')

Есть идеи, как получить доступ к значению имени файла для всех результатов?

Answer 1

Вы передаете this.props.search.searchResults.items в качестве свойства данных плоского списка, что означает, что функция _renderItemInfo будет передаваться каждому члену этого массива в качестве аргумента item.

Это означает, что вы должныпросто получите доступ к item.image.filename при настройке URI вашего компонента изображения.