url 使用 React Player 更改时如何停止播放已加载的视频并加载新视频？

Question

我将 React Player 添加到我的应用程序中，它看起来像：

 {videos ? <ReactPlayer url={`https://www.youtube.com/watch?v=${videos.id.videoId}`} />
         :
  <h1>No video</h1>}

它工作正常，但是当我更改 url 时没有任何反应，我想知道 url 更改时如何停止当前视频并加载新视频？

Answer 1

可能有一些逻辑会阻止 ReactPlayer 中的实际视频标签在您更改 url 时重新呈现，理论上，当您设置键更改时，组件将完全重新呈现那把钥匙。

让我们试试这个：

<ReactPlayer key={`https://www.youtube.com/watch?v=${videos.id.videoId}` url={`https://www.youtube.com/watch?v=${videos.id.videoId}`} />

How to stop playing loaded video and load a new one when url changes using React Player?