62 lines
1.3 KiB
Vue
62 lines
1.3 KiB
Vue
<template>
|
|
<div class="video">
|
|
<div class="title">{{title}}</div>
|
|
<video style="width:100%; height:100%;" :id="'a' + url" ></video>
|
|
</div>
|
|
</template>
|
|
<style lang="scss" scoped>
|
|
.video{
|
|
width: 976px;
|
|
height: 563px;
|
|
border-radius: 17px;
|
|
background: white;
|
|
position: relative;
|
|
// background-color: #0f0;
|
|
overflow: hidden;
|
|
>video{
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
.title{
|
|
position: absolute;
|
|
top: 23px;
|
|
left: 51px;
|
|
font-size: 13px;
|
|
color: #fff;
|
|
z-index: 999;
|
|
}
|
|
}
|
|
</style>
|
|
<script lang="ts">
|
|
import router from '@/router';
|
|
import { defineComponent, onMounted, onUpdated } from 'vue';
|
|
import { onBeforeRouteLeave, useRouter } from 'vue-router';
|
|
|
|
export default defineComponent({
|
|
props:{
|
|
url: {
|
|
type: String
|
|
},
|
|
title: {
|
|
type: String
|
|
}
|
|
},
|
|
setup(props, ctx){
|
|
console.log(1)
|
|
let play: any;
|
|
onUpdated(()=>{
|
|
console.log(props.url)
|
|
play = window.TCPlayer('a' + props.url, {
|
|
fileID: props.url,
|
|
appID: '1303872925'
|
|
});
|
|
})
|
|
onBeforeRouteLeave((to, from, next) => {
|
|
console.log(121)
|
|
play.dispose()
|
|
next()
|
|
})
|
|
|
|
}
|
|
})
|
|
</script> |