React Js Carousel Image onclick play Video

问题描述

在我的程序中，我需要在带有缩略图的轮播中制作视频。当我点击需要播放的图像视频时。正在存储存储在库中的视频和图像。

我使用以下代码来显示视频和图像。

public render(): React.ReactElement<IDucSpfxVideoProps> {    
    const imageClick = (index) => {           
      {this.state.videoURLs.map((imageList,index) => {                    
        return (<div>    
                 <video width="370" height="240" controls autoplay = {false} loop muted>
                 return <source key={index} src={imageList} type="video/mp4"/>;                 
                 </video>
        </div>)   
      })}   
    } 
    return (
       
                 {this.state.videoURLs.map((imageList,index) => {                    
                  return (<div>    
                 <video width="370" height="240" controls autoplay = {false} loop muted>
                 return <source key={index} src={imageList} type="video/mp4"/>;
                 </video>
                  </div>)   
                })}                
                      <Carousel showThumbs={true} autoplay={false} infiniteLoop={true} showIndicators={false} showStatus={true}>             
                {this.state.videoURLs.map((imageList,i) => {    
                  return (<div>    
                <img id={i.toString()} src={imageList} onClick={imageClick}/>
                  </div>)   
                })}   
              </Carousel>
            
    );
  
}
How to map while clicking a image in a thumbnail i need to play a video in a video source.

This is possible?

谢谢，迪内什

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

javascript reactjs reactjs