现象
最近在做一个需求,需要在微信小程序中嵌入h5页面,h5页面内嵌入了一个video视频,当iOS用户打开,并且其开启了屏幕自动旋转,全屏之后,横屏观看,点击左上角的关闭按钮,webview的样式会错乱。
问题原因
微信小程序强制webview页面不能横屏,但是video视频全屏后是系统组件,可以横屏,所有就造成了这种情况
解决方案
微信小程序可针对单个页面配置其是否允许横屏(微信默认是不能横屏),即可解决问题,代码如下:
{
window: {
"pageOrientation": "auto",
}
}
参考链接:https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/app.html