无法成功从反应图像渲染灯箱

时间:2019-07-11 09:35:52

标签: javascript html css reactjs lightbox

我正在尝试显示图像以及单击它们和单击它们的功能。为了渲染图像列表,我正在使用Material-UI的Gridlist。

<div>
                {(this.props.photoList.length !== 0 && this.props.currentImage !== -1) &&
                    <Lightbox
                        images={this.props.photoList}
                        isOpen={true}
                        onClose={this.props.closeLightbox}
                        onClickPrev={this.props.gotoPrevious}
                        onClickNext={this.props.gotoNext}
                        currentImage={this.props.currentImage}
                    />
                }
            </div>

我要发送的道具的最高峰:

this.props:  {photoList: Array(20), closeLightbox: ƒ, gotoPrevious: ƒ, gotoNext: ƒ, currentImage: 0, …}


closeLightbox: ƒ ()
currentImage: 0
gotoNext: ƒ ()
gotoPrevious: ƒ ()
openLightbox: true
photoList: [
{src: "./assets/dataset/v4/train/day/img/LB-X_682_20130629_110750_frame1.png", width: 16, height: 9}
{src: "./assets/dataset/v4/train/day/img/LB-X_682_20130629_110750_frame41.png", width: 16, height: 9}
{src: "./assets/dataset/v4/train/day/img/LB-X_682_20130629_110750_frame81.png", width: 16, height: 9}
{src: "./assets/dataset/v4/train/day/img/LB-X_682_20130629_110750_frame121.png", width: 16, height: 9}
}]

让我知道我是否在这里缺少一些道具

0 个答案:

没有答案