Я хочу добавить кнопку «скачать» на модальной карусели, используя реагирующие изображения, кнопка должна быть доступна в модальном всплывающем окне - PullRequest
Новая
       23

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

1 голос
/ 21 октября 2019

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

<div>
  <h2>Using with a Lightbox component</h2>
  <Gallery photos={photos} onClick={openLightbox} />

  <ModalGateway>
    {viewerIsOpen ? (
      <Modal onClose={closeLightbox}>
        <Carousel
          currentIndex={currentImage}
          views={photos.map(x => ({
            ...x,
            srcset: x.srcSet,
            caption: x.title
          }))}
        />
      </Modal>
    ) : null}
  </ModalGateway>
  <div>
    <Down />
  </div>
</div>

1 Ответ

1 голос
/ 21 октября 2019

Вы можете создать свой собственный компонент: 

const CustomFooter = ({ isModal, currentView }) => isModal && (
  <div className="react-images__footer">
    <button
      className="btn some-stylin"
      type="button"
      onClick={() => { downloadImage(currentView.src); }}
    >
      Download
    </button>
  </div>
);


<ModalGateway>
    {modalIsOpen ? (
        <Modal onClose={this.toggleGallery}>
            <Carousel
              views={this.imgs}
              currentIndex={currentIndex}
              frameProps={{ autoSize: 'height' }}
              components={{ Footer: CustomFooter }}
            />
        </Modal>
    ) : null}
</ModalGateway>
...