在做电视端APP的时候，我们需要使用到点击按钮，实现全屏播放视频，我们可以使用以下方法来实现：
1、前端模板代码
<template>
<view class="content">
<view class="videocontent">
<view class="video">
<video id="videoId" :src="detail.resDetail.playUrl" autoplay='true' enable-play-gesture='true' controls='true' objectFit="cover" @fullscreenchange='fullscreenchange' play-strategy='2'></video>
</view>
</view>
</view>
</template>
<view @tap="quanping">
<image src="../../static/all.png" mode="widthFix"></image>
<text>全屏</text>
</view>2、js代码：
<script>
export default {
// 全屏
quanping(){
let videoContext = uni.createVideoContext('videoId', this)
videoContext.requestFullScreen()
},
//退出全屏时暂停
fullscreenchange(e) {
if (!e.detail.fullScreen) {
uni.createVideoContext('videoId', this).pause();
}
},
//退出全屏时停止
fullscreenchange (e){
if(!e.detail.fullScreen){
this.videoContext.stop()
}
},
}
</script>
关于简忆
简忆诞生的故事
粤ICP备16092285号
文章评论（0）