❤ vue的实际使用

❤ 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 = ('你的视频地址')

你可能感兴趣的:(Vue,vue.js,前端,javascript)