共计 615 个字符,预计需要花费 2 分钟才能阅读完成。
html 代码:
<div class='video-list'>
<div class="video-wrap" v-for="(item, index) in dataList" :key="index">
<div class="video">
<video :src="item.src" @play="handlePlay(index)" controls="controls">
您的浏览器不反对 video 标签。</video>
</div>
</div>
</div>
javascript 代码:
data () {videoElement: [] // 创立一个数组
},
mounted () {this.videoElement = document.getElementsByTagName('video') // 获取页面上所有的 video 对象
},
handlePlay (index) {
const videoElement = this.videoElement
if (videoElement && videoElement.length > 0) {for (let i = 0; i < videoElement.length; i++) {if (i === index) {this.videoElement[i].play()} else {this.videoElement[i].pause()}
}
}
}
原生 video 成果简陋,仅供参考。
参考链接:
https://segmentfault.com/a/11…
正文完