使用 reactjs 播放视频 iframe

Question

enter image description here有问题。我有一个包含 2 个图像和 1 个视频的滑块，我将视频嵌入到 iframe 中。问题是如何在播放视频时隐藏滑块的2个按钮（下一个和上一个）并在视频暂停时显示回来。

Answer 1

您应该使用 this component，它具有内置的 onPlay 和 onStop 函数，可以让您显示或不显示滑块中的箭头。

您可以通过使用箭头属性的状态来实现此目的，该状态在视频播放时设置为 false，在视频未播放时设置为 true。

举个例子：

  <ReactPlayer 
    onPlay={this.handlePlay()}
    onPause={this.handlePause()}
    url='yourvideourl' />

注意：handlePlay() 应将箭头状态变量的状态设置为 true，将 handlePause() 设置为 false。