vue-一页面多个video只播放一个的解决办法

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...