Как зациклить вложенный массив FlatList

кто-нибудь, пожалуйста, может просветить, как зациклить вложенный массив FlatList? Я знаю, что у меня уже есть вопрос по этой теме, но до сих пор не понятно, как использовать параметры элемента!
например: в Реакте есть сообщения.jsx

var size = 1;
    const posts = this.state.posts.map(post => {
      return (
        <Link to = {`/posts/${post.slug}`}>
          <div className = "columns col-gapless" key = {post.id}>
            <div className = "column col-3 ">
              {post.attachments.slice(0, size).map(a => (
                <img
                  className = "img-responsive"
                  key = {a.id}
                  src = {a.image.thumb.url}
                  alt = ""
                />
              ))}
            </div>
            <div className = "column col-6  ">
              <h5>{post.title}</h5>
              <p>{post.body}</p>
            </div>
          </div>
        </Link>

Но посты на РН


_renderItem = ({ item }) => {
    let size = 1;
    const items = item.attachments
      .slice(0, size)
      .map(a => (
        <Image
          style = {{ width: 100, height: 75, flex: 1 }}
          key = {a.id}
          resizeMode = "cover"
          source = {{ uri: a.image.thumb.url }}
        />
      ));

    return (
      <View style = {{ height: 100 }}>
        <View>{items}</View>
        <Text>{item.title}</Text>
      </View>
    );

  };


  <FlatList
          data = {this.state.posts}
          keyExtractor = {(_, index) => `item-${index}`}
          renderItem = {this._renderItem}
          ItemSeparatorComponent = {this.renderSeparator}
          onEndReached = {this.onNextPage}
          onEndReachedThreshold = {0.01}
        />
);

Список отображает сообщения, но не изображения из сообщений! Итак, я сомневаюсь, что не отображаю изображение, потому что это объект или массив внутри массива? а FlatList не очень хорошо работает с вложенным массивом? В любом случае, любая помощь будет здорово!

пожалуйста, поделитесь образцом flatList, который вы используете

Naga Sai A 12.07.2019 17:37

@NagaSaiA, это FlatList, который я использую! есть другой?

Danks 12.07.2019 17:42

Я не вижу FlatList, пожалуйста, добавьте к вопросу

Naga Sai A 12.07.2019 17:46
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
3
510
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Похоже, ваша функция _renderItem ничего не возвращает.

Если это не ошибка копирования и вставки при публикации вопроса, добавьте утверждение return items; в конце _renderItem.


Обновлять:
Если вам всегда нужно только первое изображение, почему бы просто не сделать что-то подобное и избежать Array?

_renderItem = ({ item }) => {
    const a = item.attachments[0];
    const items = 
        <Image
          style = {{ width: 100, height: 75, flex: 1 }}
          key = {a.id}
          resizeMode = "cover"
          source = {{ uri: a.image.thumb.url }}
        />;
    ...

Спасибо ᆼᆺᆼда действительно была ошибка, я отредактировал свой вопрос! но все равно! Итак, следует ли использовать другой возврат только для изображения?

Danks 12.07.2019 19:05

size постоянно 1 или меняется?

ᅙᄉᅙ 12.07.2019 19:13

постоянно 1! первое изображение массива!

Danks 12.07.2019 19:15

@Danks В таком случае, почему бы просто не сделать items сам <Image> и избежать массива? Обновил мой ответ с образцом

ᅙᄉᅙ 12.07.2019 19:22

ᆼᆺᆼ Большое спасибо! Уверен, это правильное решение!

Danks 12.07.2019 19:38

но все еще не показывает изображение, я думаю, что это проблема с получением с редуксом!

Danks 12.07.2019 19:43

Другие вопросы по теме