如何防止在 React 状态更新时刷新 HTML 视频元素（以及 iFrame）？

Question

我是 React 新手。

我正在处理我当前使用的项目 HTML video Element。

我想通过使用 React 状态向视频添加章节，但是当我尝试时，视频元素刷新并且播放位置移动到开头。

如何防止在 React 状态更新时刷新视频 HTML？

Answer 1

尝试创建一个单独的视频组件并将 URL 作为道具传递。将其包装在 React.memo 中。现在该组件将仅在 URL 更改时重新呈现。

const Parent = () => (<div><VideoComponent url={"SOME_URL"}/></div>)


const VideoComponent = React.memo(function MyVideoComponent({url}) {
      // only renders if url have changed!
      return (<video src={url}></video>)
});