input获取视频后预览

支持MP4,不支持mov格式视频

/*
* videofile 传入的视频文件
**/
creatFileSrc = (videofile) => {
        const reader = new FileReader();
        reader.onload = (evt) => {
            const myVideo = document.querySelector("#myVideo");
            myVideo.src = evt.target.result;
        };
        reader.readAsDataURL(videofile);

        myVideo.play().then(() => {
            console.log('视频播放成功')
        }).catch((error) => {
            console.error('此视频不支持预览', error)
        })
}

<video id="myVideo" autoPlay width="300"/>

可以预览MP4,MOV格式的封面,不能正常播放视频

// 直接将 videofile 视频文件给 src
<video width="320" height="240" controls="controls">
     <source src={videoFile} type="video/mov"/>
     <source src={videoFile} type="video/mp4"/>
     your browser does not support the video tag.
</video>
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容