<template>
  <div class="livenvr">
    <LivePlayer
      :dblclick-fullscreen="false"
      aspect="fulllscreen"
      ref="livePlayer"
      :videoUrl="url"
      :controls="false"
      :live="true"
    />
  </div>
</template>

<script>
import LivePlayer from "@liveqing/liveplayer";

export default {
  name: 'liveNVRPlayer',
  props: {
    url: {
      type: String,
      default: '',
    },
  },
  components: { LivePlayer },
  data() {
    return {};
  },
  watch: {
    url: {
      handler(newVal, oldVal) {
        if (newVal == oldVal) {
          return;
        }
        // console.log('livenvr', value)
        if (newVal ) {
          this.$nextTick(() => {
            this.$refs["livePlayer"]?.play();
          });
        }
      },
      deep: true,
      immediate: true,
    },
  },
  mounted() {
  },
  methods: {
    init() {
    },
    fullScreen(){
      this.$refs.livePlayer.requestFullscreen();
    }
  },
};
</script>

<style lang="scss" scoped>
</style>