<a href="wechatide://minicode/50xTW4mE7N2p" target="_blank">wechatide://minicode/50xTW4mE7N2p</a> 挺搞笑的,我自己上传的bug报告代码段,自己打开这个链接,wxml里面全是问号。上传几次都这样,居然又发现一个新bug [图片] ----------------------------------------------------------你可能也打不开 代码段,我自己把代码复制给你,就几行 wxml: <view>模拟器正确,真机上错误的,宽度:{{dOneImageWidth}}rpx</view> <view class='oneimageview' style="width:{{dOneImageWidth}}rpx;height:400rpx;"> <image src="http://www.qszb.xyz/uploads/20180818/7a7d68451d4eb7b1bc1ece9cae02dfea.png" mode='scaleToFill'></image> </view> <view>真机,pc模拟器上都是 正确的,宽度写死:750rpx</view> <view class='oneimageview' style="width:750rpx;height:400rpx;"> <image src="http://www.qszb.xyz/uploads/20180818/7a7d68451d4eb7b1bc1ece9cae02dfea.png" mode='scaleToFill'></image> </view> wxss: .oneimageview { display: flex; flex-direction: column; justify-content: center; border-color:red; padding: 10rpx 10rpx 10rpx 10rpx; } .oneimageview image { height: 100%; width: 100%; border-width: 3rpx; border-style: solid; border-color: #ccc; } js: const app = getApp() Page({ data: { dOneImageWidth:0 }, onLoad: function () { }, onShow:function(){ var dOneImageWidth; dOneImageWidth = this.getWindowSize().wx_windowWidth * this.getWindowSize().pixelRatio; console.log(this.getWindowSize().wx_windowWidth) console.log(this.getWindowSize().pixelRatio) console.log(this.data.dOneImageWidth) this.setData({dOneImageWidth: dOneImageWidth}) }, getWindowSize: function () { var data = { screenWidth: 0, //手机屏幕宽度 px rpx要乘以 pixelRatio 设备像素比 screenHeight: 0, //手机屏幕高度 px rpx要乘以pixelRatio 设备像素比 wx_windowWidth: 0, // 小程序可使用窗口宽度 全屏下=手机屏幕宽度 wx_windowHeight: 0, // 小程序可使用窗口高度 手机屏幕高度 - 小程序顶部的的微信状态栏 pixelRatio: 2, //设备像素比 brand: '', model: '' } wx.getSystemInfo({ success: function (res) { data.screenWidth = res.screenWidth data.screenHeight = res.screenHeight data.wx_windowWidth = res.windowWidth data.wx_windowHeight = res.windowHeight data.pixelRatio = res.pixelRatio data.brand = res.brand data.model = res.model } }) return data } })
wx.getSystemInfo计算屏幕宽度不对- 当前 Bug 的表现(可附上截图) wx.getSystemInfo({ success: function (res) { data.screenWidth = res.screenWidth data.screenHeight = res.screenHeight data.wx_windowWidth = res.windowWidth data.wx_windowHeight = res.windowHeight data.pixelRatio = res.pixelRatio data.brand = res.brand data.model = res.model } }) - 预期表现 pc模拟器计算屏幕宽度=wx_windowWidth*pixelRatio=375*2=750 rpx。整个屏幕宽。 同样方法在小米5s真机上计算屏幕宽度=wx_windowWidth*pixelRatio=392*2.75=1078 rpx, 用1078 rpx这个值设置wmxl宽度就超出屏幕宽度太多,实际用750rpx就是真机整个屏幕宽(不管是真机 还是 pc模拟器 都是)。原因不详。 - 复现路径 - 提供一个最简复现 Demo
2018-08-31