Question

我在页面上添加了vimeo作为链接，并尝试使用onEnded事件，但是它不起作用。我的代码在这里

const iframe = useRef(null)
const myCallback = () => (console.log('Video has ended'));
     <iframe
        ref={iframe}
        src='some-link'
        onEnded={() => myCallback()}          
      />

请您告诉我一些可以帮助您的信息

Answer 1

我认为原生iframe不能从嵌入式Vimeo视频中检测到事件。您可以参考官方的Vimeo Player API here。如果您选择基于组件的方法，那么也有React的现有实现。

import React from "react";
import Vimeo from "@u-wave/react-vimeo";

export default function App() {
  const myCallback = () => console.log("Video has ended");

  return (
    <div className="App">
      <Vimeo video="347119375" autoplay onEnd={() => myCallback()} />
    </div>
  );
}

CodeSandBox：https://codesandbox.io/s/so-react-vimeo-embed-6xt25
参考：https://github.com/u-wave/react-vimeo

如何检测视频Vimeo完成播放的时间？

1 个答案: