<!-- html -->
<p>一、import <button @click="play1" class="play-btn">play1</button></p>
<video controls ref="videoDom1" class="video-box" autoplay>
<source src type="video/mp4" />
</video>
<p>二、require <button @click="play2" class="play-btn">play2</button></p>
<video controls ref="videoDom2" class="video-box" autoplay>
<source src type="video/mp4" />
</video>
<p>三、a标签 <a :href="video2" target="_blank" class="play-btn">play3</a></p>
// js
import video1 from "@/assets/video/test视频.mp4";
export default {
name: "HelloWorld",
data() {
return {
videoUrl1: "",
videoUrl2: "",
video2: require("@/assets/video/test视频.mp4")
};
},
methods: {
play1() {
this.$refs.videoDom1.src = video1;
},
play2() {
this.$refs.videoDom2.src = this.video2;
}
}
};
网友评论