- 发布:2020-09-02 10:31
- 更新:2020-09-02 10:31
- 阅读:911
产品分类: uniapp/App
PC开发环境操作系统: Mac
PC开发环境操作系统版本号: 10.15.6
HBuilderX类型: 正式
HBuilderX版本号: 2.7.9
手机系统: 全部
手机厂商: 华为
页面类型: vue
打包方式: 离线
项目创建方式: HBuilderX
测试过的手机:
操作步骤:
<video id="video" src="https://osscdn.jipaibuy.com/itam/rest/test/44823899df1b799edac44beb5de71eca4bbfbb3.mp4"
:controls="false"
play-btn-position="center"
@play="onPlay"
@ended="onEnd">
</video>
mounted() {
this.videoContext = uni.createVideoContext('video')
},
methods: {
onPlay() {
this.videoContext.requestFullScreen({direction:0})
this.videoContext.play()
},
onEnd() {
this.videoContext.exitFullScreen()
}
}
<video id="video" src="https://osscdn.jipaibuy.com/itam/rest/test/44823899df1b799edac44beb5de71eca4bbfbb3.mp4"
:controls="false"
play-btn-position="center"
@play="onPlay"
@ended="onEnd">
</video>
mounted() {
this.videoContext = uni.createVideoContext('video')
},
methods: {
onPlay() {
this.videoContext.requestFullScreen({direction:0})
this.videoContext.play()
},
onEnd() {
this.videoContext.exitFullScreen()
}
}
预期结果:
<video id="video" src="https://osscdn.jipaibuy.com/itam/rest/test/44823899df1b799edac44beb5de71eca4bbfbb3.mp4"
:controls="false"
play-btn-position="center"
@play="onPlay"
@ended="onEnd">
</video>
mounted() {
this.videoContext = uni.createVideoContext('video')
},
methods: {
onPlay() {
this.videoContext.requestFullScreen({direction:0})
this.videoContext.play()
},
onEnd() {
this.videoContext.exitFullScreen()
}
}
<video id="video" src="https://osscdn.jipaibuy.com/itam/rest/test/44823899df1b799edac44beb5de71eca4bbfbb3.mp4"
:controls="false"
play-btn-position="center"
@play="onPlay"
@ended="onEnd">
</video>
mounted() {
this.videoContext = uni.createVideoContext('video')
},
methods: {
onPlay() {
this.videoContext.requestFullScreen({direction:0})
this.videoContext.play()
},
onEnd() {
this.videoContext.exitFullScreen()
}
}
实际结果:
<video id="video" src="https://osscdn.jipaibuy.com/itam/rest/test/44823899df1b799edac44beb5de71eca4bbfbb3.mp4"
:controls="false"
play-btn-position="center"
@play="onPlay"
@ended="onEnd">
</video>
mounted() {
this.videoContext = uni.createVideoContext('video')
},
methods: {
onPlay() {
this.videoContext.requestFullScreen({direction:0})
this.videoContext.play()
},
onEnd() {
this.videoContext.exitFullScreen()
}
}
<video id="video" src="https://osscdn.jipaibuy.com/itam/rest/test/44823899df1b799edac44beb5de71eca4bbfbb3.mp4"
:controls="false"
play-btn-position="center"
@play="onPlay"
@ended="onEnd">
</video>
mounted() {
this.videoContext = uni.createVideoContext('video')
},
methods: {
onPlay() {
this.videoContext.requestFullScreen({direction:0})
this.videoContext.play()
},
onEnd() {
this.videoContext.exitFullScreen()
}
}
bug描述:
video组件在APP平台,用requestFullScreen api进入全屏时页面会一直跳