여러 이미지가있는 React 앱이 있습니다. 이미지를 클릭하면 iFrame API를 통해 YouTube 동영상이로드되는 모달이 열립니다. 나는 비디오 iframe을 https://www.npmjs.com/package/react-youtubeReact - 클릭 이벤트로 모바일에서 동영상 자동 재생
모달을로드하려면이 옵션을 사용하고
는 조건 추가 상태 modalVisible를 사용하여 DOM에 제거 : 참/거짓.
{this.state.modalVisible ? <div className="Modal"><YouTube videoId="2g811Eo7K8U" onReady={this._onReady} /></div> : null}
이 필요할 때 모달을 표시 한 후 표시 블록을 페이지로드에 이미 내부에 장착 된 비디오 전통적인 모달 대에 필요하고 경우에만 비디오를로드하기 때문에 이것은 아주 좋습니다.
모바일 동영상에서는 자동 재생 (https://developers.google.com/youtube/iframe_api_reference#Mobile_considerations)이 불가능하므로 기존 숨기기/표시 사전로드 된 모달에서는 이미지를 클릭하여 모달을 표시 할 때 함수를 호출하고 event.target.playVideo();
을 사용하여 비디오를 재생하여 본질적으로 자동 재생합니다.
_onReady(event) {
// access to player in all event handlers via event.target
event.target.playVideo();
}
을로드 할 수있는 방법이 있나요 : 나 이미지가 비디오를 클릭 할 때 모달로 먼저 비디오를로드하여 그것을 할 때 event.target.playVideo();
비디오가로드되면 onready 함수를 호출 할 때 작동하지 않습니다 그러면 클릭 이벤트가 발생하기 전에 동영상을로드하지 않고 클릭 기능에서 자동 재생할 수 있습니까?