循环播放缩短的视频 html 标签

Question

我有一个 React 应用程序，正在使用带有视频 url 的视频 html 标签。我只需要播放 url 中的一部分视频，因此添加 #t=6,12

但这似乎禁用了循环。有谁知道如何在只播放视频的一部分时使循环工作？

提前致谢。

<video
  src={`${option.videoUrl}#t=6,12`}
  autoPlay
  controls={false}
  loop
  muted
  playsInline
/>;

Answer 1

从React@14.版本开始支持视频元素，你可以用video element做很多动作并相应地编写你的逻辑。

你能通读一下吗link

或者，总结一下，

React DOM now supports these media events on audio and video tags: onAbort, onCanPlay, onCanPlayThrough, onDurationChange, onEmptied, onEncrypted, onEnded, onError, onLoadedData, onLoadedMetadata, onLoadStart, onPause, onPlay, onPlaying, onProgress, onRateChange, onSeeked, onSeeking, onStalled, onSuspend, onTimeUpdate, onVolumeChange, onWaiting.

示例代码：

<video
  src={url}
  autoPlay
  controls={true}
  loop
  playsInline
  onPlay={() => console.log("play start")}
  onPause={() => console.log("pause")}
  onTimeUpdate={() => console.log("time update")}
/>

循环播放缩短的视频 html 标签

Loop a shortened video html tag

html

video

reactjs