reactjs - 如何检测视频播放完毕的 react ？

Question

由于 React 使用生命周期方法和虚拟 dom，我如何检测我的视频何时播放完毕。我在stackoverflow上发现了另一个类似的问题，建议使用componentWillUnmount，但我没有从dom中删除视频，所以componentWillUnmount不会被解雇......

如何检测视频播放完毕的 react ？

Answer 1

您也可以使用 onEnded视频元素上的媒体事件。自 2015 年起支持此功能；它更容易使用并且可以在功能组件中使用。

const myCallback = () => (console.log('Video has ended'));

<video autoplay onEnded={() => myCallback()}>
    <source src={'https://somerandomvideo.url'} type="video/mp4" />
</video>

还要确保loop不是 true在视频元素上，因为这样， onEnded 事件将永远不会被触发。

更多信息在这里:
https://reactjs.org/blog/2015/09/10/react-v0.14-rc1.html