44 lines
1011 B
Vue
44 lines
1011 B
Vue
<template>
|
|
<div id="player"></div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { onMounted, onUnmounted, ref } from 'vue';
|
|
const playJs=ref("//player.polyv.net/resp/live-h5-player/latest/liveplayer.min.js");
|
|
const player=ref(null);
|
|
const props=defineProps({
|
|
vid:{
|
|
type: String,
|
|
default:''
|
|
}
|
|
})
|
|
const loadPlayerScript=(callback)=> {
|
|
if (!window.polyvLivePlayer) {
|
|
const myScript = document.createElement('script');
|
|
myScript.setAttribute('src', playJs.value);
|
|
myScript.onload = callback;
|
|
document.body.appendChild(myScript);
|
|
} else {
|
|
callback();
|
|
}
|
|
};
|
|
const loadPlayer=()=> {
|
|
const polyvLivePlayer = window.polyvLivePlayer;
|
|
player.value = polyvLivePlayer({
|
|
wrap: '#player',
|
|
width: '100%',
|
|
height: 250,
|
|
vid: props.vid,
|
|
});
|
|
}
|
|
onMounted(()=>{
|
|
loadPlayerScript(loadPlayer);
|
|
})
|
|
onUnmounted(()=>{
|
|
player.value.destroy();
|
|
})
|
|
</script>
|
|
|
|
<style>
|
|
|
|
</style> |