<template>
  <div class="video_box">
    <vue-aliplayer-v2 :source="src" ref="VueAliplayerV2" :options="options" style="width: 100%;height: 100%;"/>
  </div>
</template>

<script>

export default {
  name: 'VideoBox',
  data() {
    return {
      options: {
        // source:'//player.alicdn.com/video/aliyunmedia.mp4',
        isLive: true // 切换为直播流的时候必填（true-直播状态，false-普通模式，播放器普通视频）
      },
      show: true,
      isShowMultiple: false
    }
  },
  props: {
    src: {
      type: String,
      default: 'http://118.122.17.165:83/openUrl/itE01aM/live.m3u8'
    }
  },
  mounted() {
    // this.video = this.$refs.video
    // this.video.play()
  },
  methods: {
    play() {
      this.$refs.VueAliplayerV2.play()
    },
    pause() {
      this.$refs.VueAliplayerV2.pause()
    },
    replay() {
      this.$refs.VueAliplayerV2.replay()
    }
  }
}
</script>

<style lang="scss" scoped>
.video_box {
  width: 100%;
  height: 400px;
  overflow: hidden;
  position: relative;

  video {
    width: 100%;
    height: 100%;
  }
}

</style>