[JavaScript知识库]Vue 视频播放与暂停

使用的是easyPlayer插件，embed设置展示图片没找到方法，videoPlayer不知道怎么回事只能展示一个视频。

    <template>
 <div class="noUrl">
<EasyPlayer
          :videoUrl="showUrl + item.uuid"//视频流
          :poster="potorimg + item.uuid"//展示图片
          :autoplay="false"
          :controls="true"
          show-custom-button="true"
          :ref="'easyPlayer' + index"
        ></EasyPlayer>
<div
          :class="[
            playList.indexOf('easyPlayer' + index) == -1 ? 'play' : 'stop',
          ]"
          @click="playVideo('easyPlayer' + index)"
        ></div>
</div>
</template>

<script>
import EasyPlayer from "@easydarwin/easyplayer";
export default {
  components: {
    EasyPlayer,
  },
  data() {
 potorimg:
        process.env.VUE_APP_SERVER_GATEWAY_URL +
        "/aiMultimedia/monitoringData/getVideoPreview?uuid=",
      showUrl:
        process.env.VUE_APP_SERVER_GATEWAY_URL +
        "/aiMultimedia/monitoringData/getVideoAudio?uuid=",
      playList: [],
},
methods: {
    playVideo(player) {
      let [player_] = this.$refs[player];
      if (this.playList.indexOf(player) == -1) {
        this.playList.push(player);
        player_.$el.getElementsByClassName("video-js")[0].play();
      } else {
        this.playList.splice(this.playList.indexOf(player), 1);
        player_.$el.getElementsByClassName("video-js")[0].pause();
      }
    },
}

<style scoped lang="scss">
    .noUrl {
      height: 100%;
      width: 100%;
      position: relative;
      background: url("./assets/realtime/videoPubFirst.png") no-repeat;//背景图
      background-size: 100% 100%;
      .play {
        height: 1.77vw;
        width: 1.77vw;
        position: absolute;
        top: calc(45% - 0.89vw);
        left: calc(50% - 0.89vw);
        background: url("./../public/icon-play.png") no-repeat;//播放按钮
        background-size: 100% 100%;
        z-index: 1;
        cursor: pointer;
      }
      .stop {
        height: 1.77vw;
        width: 1.77vw;
        position: absolute;
        top: calc(45% - 0.89vw);
        left: calc(50% - 0.89vw);
        background: url("./public/icon-stop.png") no-repeat;//暂停按钮
        background-size: 100% 100%;
        z-index: 1;
        cursor: pointer;
      }
</style>