<video>标签在vue中动态绑定地址不能自动播放的问题
背景:记录下后端程序员在做企业门户时,标签在vue中使用遇到的问题。门户主要做一些炫酷界面,用视频标签展示展示一些mp4等格式的视频。问题:动态绑定的地址视频不能自动播放解决方案:<videopreload="auto" controls="controls" muted loop style="width:500px;height: 500px;"ref="videoId"><
·
背景:记录下后端程序员在做企业门户时,标签在vue中使用遇到的问题。门户主要做一些炫酷界面,用视频标签展示展示一些mp4等格式的视频。
问题:动态绑定的地址视频不能自动播放
解决方案:
<video preload="auto" controls="controls" muted loop style="width:500px;height: 500px;" ref="videoId">
<source :src="addressUrl" type="video/mp4">
</video>
在异步回调方法里重新绑定
this.$refs.videoId.src=this_.static(静态服务器前缀http://127.0.0.1:8080/static)+adress(你的视频在静态服务器的路径/xx/xx/xx.mp4);
注意:重点来了,在video标签里面muted是规定视频的音频输出应该被静音。但是我的视频没有声音,我要做的效果,就是一个视频自动循环播放 按道理muted标签设置不设置是不影响的 ,但是实际情况是 ,如果不设置muted标签 ,视频加载出来就是不能自动播放,尝试了n种动态绑定的src的方法都行不通。也参考了一些其他网友,有设置定时任务 重新绑定src的等等,最后都不行,所有总结下供大家参考,少走些弯路,按时下班!
更多推荐
已为社区贡献2条内容
所有评论(0)