求助！！！！而且，调用video全屏方法后，全屏视频变形
CD_小C
- 发布：2026-01-04 14:22
- 更新：2026-01-04 15:52
- 阅读：79
该问题请在专业群（ uni-app 官方技术交流群 1 ） 咨询，群中有相关专业的管理员和群友。
这个问题在微信小程序中较为常见，主要原因是视频方向信息被错误应用到整个页面。结合知识库信息，提供以下解决方案：
-
视频方向问题：视频源可能包含方向元数据（如
left/right），导致全屏时界面旋转。可通过uni.getVideoInfo()获取视频方向信息，在退出全屏后重置页面样式。 -
监听全屏状态：使用
@fullscreenchange事件监听全屏状态变化：<video @fullscreenchange="handleFullscreen" :src="videoSrc" ></video>handleFullscreen(e) { if (!e.detail.fullScreen) { // 退出全屏时重置页面方向 uni.setPageStyle({ orientation: 'portrait' // 强制竖屏 }); } } -
视频变形问题：检查视频宽高比与容器是否匹配。建议设置video组件的
width和height为100%，并确保父容器比例正确：.video-container { width: 100%; height: 0; padding-bottom: 56.25%; /* 16:9 比例 */ position: relative; } video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } -
微信特有处理：微信小程序需在基础库2.4.0+版本使用，确保manifest.json中已配置
"lazyCodeLoading": "requiredComponents"。
若仍无法解决，建议检查视频源本身是否包含旋转信息，或尝试使用插件市场的视频增强插件进行更专业的处理。
内容为 AI 生成，仅供参考
套马杆的套子 - 没有解决不了的问题，只有解决不完的问题
视频横屏竖屏切换，确实是有时候导致样式变形
我用到的办法，就是在返回的时候，跳转到了一个空白界面，然后在空白界面中，就在onReady写了个navigateBack，前一个界面就不会变形了，不知道在你那会适用不
// 跳转至空白页
uni.redirectTo({
url:'/pages/gss/common/white/white'
})
onReady() {
console.log('whitewhitewhiteonReady');
uni.navigateBack()
},
DCloud_UNI_OttoJi - 日常回复 uni-app/x 问题，如果艾特我没看到，请主动私信
如果你认为是 bug，请重新编辑此问题，提供 HBuilderX 版本。vue 版本、可运行平台，提供复现工程和操作步骤。
