注册登录

l***@163.com

发布：2021-08-04 13:15
更新：2024-01-31 16:29
阅读：2475

【报Bug】video组件direction属性默认不起作用，全屏播放永远都是横屏

分类：uni-app

bug已修复

产品分类： uniapp/App

PC开发环境操作系统： Windows

PC开发环境操作系统版本号： win10

HBuilderX类型：正式

HBuilderX版本号： 3.2.0

手机系统：全部

页面类型： vue

打包方式：云端

项目创建方式： HBuilderX

测试过的手机：

iphone7，8，10都是最新系统，安卓华为，小米，vivo最新系统

示例代码：

<video src="https://jvod.300hu.com/vod/product/137be37a-e618-4666-b1e6-c30202c36554/986e8fbd937342c09b699a2a8a86b6ff.mp4?source=2&h265=h265/18799/4ac560eac78d421f991d09f670be1f50.mp4"></video

操作步骤：

直接咱贴代码即可，关键代码就一行

预期结果：

全屏播放不会竖屏，即使视频是竖屏格式

实际结果：

全屏播放不会竖屏，即使视频是竖屏格式

bug描述：

video组件direction不设置，全屏默认横屏播放，并不会像文档所说的【不指定则根据宽高比自动判断】

video-test.rar

2021-08-04 13:15 负责人:天生DR 分享

11 个回复

DCloud_UNI_Anne

感谢您的反馈，已加分！

l***@163.com (作者)

一年了，你们都不解决，，，是技术瓶颈吗

2022-08-13 13:15
1***@qq.com

回复 l***@163.com: this.$refs.videoF.requestFullScreen({direction: 0});

2022-10-19 14:55
百倍

修不好的吗？video组件direction不设置，全屏默认横屏播放，并不会像文档所说的【不指定则根据宽高比自动判断】

2023-06-25 15:37
DCloud_UNI_Anne

回复百倍: video组件direction不设置，全屏根据宽高比自动判断，用上面示例测试看看

2023-06-26 18:24

1***@qq.com

this.$refs.videoF.requestFullScreen({direction: 0});

渊默

我这边用ref调提示找不到这个方法【TypeError: this.$refs.myVideo.requestFullScreen is not a function】

2022-11-06 22:51

1***@qq.com

回复渊默: <video ref="videoF" >

if (this.$refs.videoF) {

this.$refs.videoF.requestFullScreen({direction: 0});

}

playClick() {

let _this = this

if (this.$refs.videoF) {

        this.$refs.videoF.play();  

} else {  

        clearTimeout(this.setTime)  

        this.setTime = setTimeout(() => {  

            _this.playClick()  

        }, 100)  

}

}

2022-11-17 16:51

k***@163.com

好用！

2023-04-24 14:35

DCloud_UNI_Anne

ios和Android表现是否一致？
测试暂时复现问题，请提供一个可复现的示例（上传附件），方便我们排查问题

l***@163.com (作者)

附件我已经上传了，其实很简单，就创建一个uniapp基础项目，弄一个video标签，放一个竖屏视频连接，再打包到手机上全屏播放就能看到全部是横屏播放的效果了

【<video src="https://jvod.300hu.com/vod/product/137be37a-e618-4666-b1e6-c30202c36554/986e8fbd937342c09b699a2a8a86b6ff.mp4?source=2&h265=h265/18799/4ac560eac78d421f991d09f670be1f50.mp4"></video>】

这是关键代码，上边也有附件是整个demo

2021-08-08 15:00
l***@163.com (作者)

安卓和ios都是默认横屏播放，测试了很多手机了

2021-08-08 15:01
DCloud_UNI_Anne

回复 l***@163.com: IOS13.6.1，iPhone 6s Plus测试复现问题。Android 10，小米8测试正常。请提供下复现此问题的具体设备信息，方便我们排查问题。

2021-08-09 14:32
DCMarvel

回复 DCloud_UNI_Anne: 这个判断方向有没有暴露判断接口,api设置全屏如何拿到视频宽高比?

2021-08-09 15:17
l***@163.com (作者)

回复 DCloud_UNI_Anne: 测试用的苹果手机是iphone 7 版本 14.7.1，安卓手机是vivo 系统7.1.2，还有一个手机也是vivo，设备具体信息暂无法查看了，还有客户用的华为手机也有这个问题，你们可以多找几台手机试试，很多手机都能复现这个问题

2021-08-09 16:00

5***@qq.com - 时间

现在好使了么我也发现这个问题了

l***@163.com (作者)

没有

2022-08-13 13:15

l***@gmail.com

什么时候解决啊

DCloud_UNI_Anne

此问题已修复了，用上方示例测试正常，你试下，如果还有问题提供下你的最小化复现示例（上传附件）

2022-08-24 16:08

渊默

现在还有这个问题……

1***@qq.com

就这思路，我是已经实现了的
<video ref="videoF" >
if (this.$refs.videoF) {
this.$refs.videoF.requestFullScreen({direction: 0});
}

playClick() {
let _this = this
if (this.$refs.videoF) {

        this.$refs.videoF.play();  
} else {  
        clearTimeout(this.setTime)  
        this.setTime = setTimeout(() => {  
            _this.playClick()  
        }, 100)  
}

}