Блог

Что-то не так с тем, как я заполняю карусель. Существует два вложенных цикла. Я использую «ключ» по мере необходимости. Ничего не отображается. Вы видите, что не так?

 <Carousel
  responsive={responsive}
  ssr
  infinite
  itemClass="carouselItem"
  draggable={true}
  deviceType="desktop"
>
  {Object.keys(props).map(function (organizationId, index) {
    let organization2 = props[organizationId];
    let events = organization2.events;
    return (
      <div key={organizationId}>
        {Object.keys(events).map(function (programId, index) {
          <div key={`${props[organizationId].events[programId].imgId}`}>
            <Image
              src={`http://ticket-t01.s3.eu-central-1.amazonaws.com/${props[organizationId].events[programId].imgId}_0.cover.jpg`}
              className={styles.carouselImage}
              layout="responsive"
              width={865}
              height={513}
              key={`${props[organizationId].events[programId].imgId}`}
              priority={true}
            />
            <div>{props[organizationId].events[programId].name}</div>
            <div>{props[organizationId].name}</div>
          </div>;
        })}
      </div>
    );
  })}
</Carousel>
 

Странно, это работает здесь, когда карта не вложена:

 <Carousel
  responsive={responsive}
  ssr
  infinite
  itemClass="carouselItem"
  draggable={true}
  deviceType="desktop"
>
  {imageUrls amp;amp;
    imageUrls.map((url: string, index: number) => (
      <div>
        <Image
          src={url}
          className={styles.carouselImage}
          layout="responsive"
          width={865}
          height={513}
          key={url}
          priority={true}
        />
        <div></div>
        hello
      </div>
    ))}
</Carousel>
 

    {Object.keys(events).map(function (programId, index) {
          <div key={`${props[organizationId].events[programId].imgId}`}>
 

В вашем втором map обратном вызове нет return ключевого слова.