美文网首页
vue 腾讯云点播播放视频(单视频)

vue 腾讯云点播播放视频(单视频)

作者: 奕格 | 来源:发表于2021-02-23 14:46 被阅读0次

<template>

<div>

<video v-if="showFlag" :id="tcPlayerId" preload="auto" width="640" height="368" playsinline webkit-playsinline

x5-playsinline></video>

</div>

</template>

<script>

export default {

name: 'Detail',

data() {

return {

tcPlayerId: 'tcPlayer' + Date.now(),

player: null,

showFlag: false,

videoFileid: '',

videoAppid: '',

dataList: []

}

},

mounted() {

let self = this

setTimeout(() => {

self.showFlag = true

self.videoFileid = ''"

self.videoAppid = '1111'

self.$nextTick(() => {

  self.getVideoLang(self.videoFileid, self.videoAppid,self.tcPlayerId)

})

}, 1000)

},

methods: {

// 初始化腾讯云播放器

getVideoLang(fileID, appID, id) {

const playerParam = {

fileID: fileID,

appID: appID,

psign: "dddddd"

}

window.TCPlayer(id, playerParam)

}

}

}

</script>

<style lang="scss">

@import "https://imgcache.qq.com/open/qcloud/video/tcplayer/tcplayer.css"

</style>