按【bug描述】中的,在页面中设置rpx为单位的元素,并按原代码设置横屏,不在pages.json中做横屏配置,会出现以下结果 在hbuilder底座调试的app 与 打包后的app 首页样式不同。
![bzning](https://img-cdn-tc.dcloud.net.cn/account/identicon/f596a0d8477408156146214587d2259e.png)
- 发布:2021-04-01 19:50
- 更新:2021-04-01 19:50
- 阅读:515
产品分类: uniapp/App
PC开发环境操作系统: Mac
PC开发环境操作系统版本号: 10.15.4
HBuilderX类型: 正式
HBuilderX版本号: 3.1.7
手机系统: Android
手机系统版本号: Android 10
手机厂商: 华为
手机机型: 华为MatePad BAH3-W59
页面类型: vue
打包方式: 云端
项目创建方式: HBuilderX
操作步骤:
预期结果:
在hbuilder底座调试的app 与 打包后的app 首页样式相同,打包的结果依赖调试是看到的。
rpx的计算时机是什么?按上述方法解决是否正确?
在hbuilder底座调试的app 与 打包后的app 首页样式相同,打包的结果依赖调试是看到的。
rpx的计算时机是什么?按上述方法解决是否正确?
实际结果:
在hbuilder底座调试的app 与 打包后的app 首页样式不同
在hbuilder底座调试的app 与 打包后的app 首页样式不同
bug描述:
【问题】
在hbuilder底座调试的app 与 打包后的app 首页样式不同,如图左侧是底座中的app,右侧是打包安装后的app,右侧尺寸明显大于左侧,只有在首页会出现这种情况
【原代码】
在App.vue中设置横屏的代码如下
onLaunch: function () {
// #ifdef APP-PLUS
plus.screen.lockOrientation('landscape-primary')
// #endif
}
【解决】
在pages.json中做了如下配置
"globalStyle": {
"pageOrientation": "landscape"
}
【猜测原因】
打包后的app,首屏时uni-app根据竖屏计算rpx适配的,导致尺寸与预期不一致,故设置了pages.json中的如上配置
![](http://img-cdn-tc.dcloud.net.cn/uploads/questions/20210401/12e4d0edbb1ebb73f30068a0feeeffff.jpg)