❤ vue的实际使用
vue项目中video标签的动态路径使用方法及里面的坑
需求:
在详情展示的时候播放.mp4文件,然后动态改变这个视频的路径无法生效
原因:
使用video标签的时候,会在里面嵌套一个source标签
<video controls="controls" width="960px" autoplay="autoplay"><source :src="url+videoUrl " type="video/.mp4" />
</video>
① 解决方法
url是固定的路径,videoUrl是动态的路径,这就导致我在切换数据详情页的时候,不会跟着详情的路径进行改变,分析是这个标签使用的问题
<video :src=" url + videoUrl " controls="controls" width="960px" autoplay="autoplay">
</video>
把里面的source标签去掉 里面的路径写在video上面,这样就可以动态改变video了
(未生效)
return {url: require("../assets/promotionalVideo.mp4")
};
更改地址:
this.$refs.video.src = ('你的视频地址')