- 发布：2024-03-11 18:06
- 更新：2024-09-23 02:29
- 阅读：524
产品分类： uniapp/App
PC开发环境操作系统： Mac
PC开发环境操作系统版本号： 13.2.1
HBuilderX类型： 正式
HBuilderX版本号： 3.8.12
手机系统： 全部
手机厂商： 华为
页面类型： nvue
vue版本： vue2
打包方式： 云端
项目创建方式： HBuilderX
App下载地址或H5⽹址： https://sj.qq.com/appdetail/com.hzmodi.motocircle?source=gdaq
测试过的手机：
示例代码：
"screenOrientation" : [ "portrait-primary", "landscape-primary" ],```
``` // #ifdef APP-PLUS```
``` plus.screen.unlockOrientation();```
``` plus.screen.lockOrientation('portrait-primary');```
``` // #endif```
"screenOrientation" : [ "portrait-primary", "landscape-primary" ],```
``` // #ifdef APP-PLUS```
``` plus.screen.unlockOrientation();```
``` plus.screen.lockOrientation('portrait-primary');```
``` // #endif``` 操作步骤：
关闭手机系统竖屏锁定，横屏进入app，恢复成竖屏后，全局样式错乱
关闭手机系统竖屏锁定，横屏进入app，恢复成竖屏后，全局样式错乱
预期结果：
横屏进入app，恢复成竖屏后
横屏进入app，恢复成竖屏后
实际结果：
关闭手机系统竖屏锁定，横屏进入app，恢复成竖屏后，全局样式错乱
关闭手机系统竖屏锁定，横屏进入app，恢复成竖屏后，全局样式错乱
bug描述：
manifest.js里设置了"screenOrientation" : [ "portrait-primary", "landscape-primary" ]，app直接横竖屏。
关闭手机屏幕方向锁定，横屏状态下点击app进入，导致首页（tabBar页面均为nvue）app样式就错乱了。
因为有页面需要手动改变横屏，所以screenOrientation里都需配置，但横屏进入app就会出现样式错乱无法恢复。
哪怕使用跳转空白页面的方法和延时也无法改变，竖屏进入改变屏幕方向时候不会出现这个问题。
必须重新退出app，以竖屏的方向进入才能恢复，不然关闭手机系统的竖屏锁定，横屏进入，怎么弄都是无法恢复了
h***@163.com (作者)
看了很多帖子，都说是rpx的问题，都说是nvue页面用rpx就会出现这个问题，但如果你是竖屏手动变横屏，是可以改回来的。
那正常来说，横屏变成竖屏应该也不会有问题，目前这个bug非常的致命啊。。。。希望官方可以修复一下，或者提供一些方法
hhyang - 如有问题，请添加QQ1606726660 备注付费咨询
不用这么麻烦，非常简单
html{
font-size: calc(100vw / 23.5) !important
}-
h***@163.com (作者)
这个方法不太行，那个东西是手机系统自带的默认，没办法通过改变px生效的，他只要是进入后就会以第一次的分辨率去渲染，app是只有我们想让用户看横屏的时候才会横屏，不然都要用户看竖屏，通过首次进入app后判断是什么屏幕，强制锁定后重启就好了plus.runtime.restart();。我的解决方案是这个，我们用的vue和nvue混合开发
// #ifdef APP-PLUS
if (plus.navigator.getOrientation()) {
plus.screen.lockOrientation("portrait-primary");
plus.runtime.restart();
} else {
plus.screen.lockOrientation('portrait-primary');
}
// #endif2024-10-08 09:53
