<Image> компонент не показывает изображение из URI, который выбирается из базы данных - PullRequest
0 голосов
/ 20 апреля 2020

Прежде всего позвольте мне объяснить немного структуры. Я использую redux useSelector для получения состояния определенного хранилища, в этой конкретной проблеме я использую два хранилища, которые

users = useSelector(state => state.usersKey.userMaster);
stories = useSelector(state => state.storiesKey.stories);

users хранят пользовательские данные, такие как идентификатор пользователя, имена, аватары. в то время как stories хранит медиафайлы и идентификатор пользователя, которому принадлежит эта история (подумайте об истории Instagram). Я использую базу данных Firebase Realtime в качестве хранилища.

Итак, у меня есть этот FlatList, в котором перечислены компоненты "Stories", состоящие из круга, в котором должен быть аватар пользователя, и имя пользователя под ним. Плоский список получает свои данные из магазина stories. В подпункте name я выбираю имя пользователя, открывая хранилище users и сопоставляя сохраненный там uid с тем, который хранится в хранилище stories. Это работает так, как задумано, так как имена отображаются правильно.

<FlatList
      showsHorizontalScrollIndicator={false}
      horizontal
      data={stories}
      keyExtractor={item => item.id}
      renderItem={itemData => (
        <Stories
         name={users
            .filter(prod => prod.uid === itemData.item.id)
            .map(e => e.name)}
          avatar={users
            .filter(prod => prod.uid === itemData.item.id)
            .map(e => e.avatar)}
          onPress={() => {
            carouselHandler(itemData.item.id);
          }}
        />
      )}
    />

Я подумал, что этот метод будет работать также с пропеллером avatar, поэтому я сделал то же самое, но неожиданно он дал мне ошибку, которая читает Error while updating property 'src' of a view managed by: RCTImageView null Value for uri cannot be cast from ReadableNativeArray to String несмотря на то, что ему удалось успешно извлечь uri / ссылку на файл просто отлично. Я проверил с помощью оповещений, и все они показывают правильные ссылки

это Stories компонент

 <View style={styles.storiesContainer}>
  <View style={styles.storyItemContainer}>
    <TouchableOpacity onPress={props.onPress}>
      <Image style={styles.userImage} source={{ uri: props.avatar }} />
    </TouchableOpacity>
    <View style={styles.text}>
      <Text numberOfLines={1}>{props.name}</Text>
    </View>
  </View>
</View>

Заранее спасибо.

...