小程序 wx.getSystemInfoSync 获取 windowHeight 不准确的问题
如果本文对你有用,请爱心点个赞,提高排名,帮助更多的人。谢谢大家!❤
如果解决不了,可以在文末进群交流。
wx.getSystemInfo(OBJECT)
获取系统信息。
OBJECT参数说明:
参数 | 类型 | 必填 | 说明 |
---|---|---|---|
success | Function | 是 | 接口调用成功的回调 |
fail | Function | 否 | 接口调用失败的回调函数 |
complete | Function | 否 | 接口调用结束的回调函数(调用成功、失败都会执行) |
success回调参数说明:
参数 | 说明 | 最低版本 |
---|---|---|
brand | 手机品牌 | 1.5.0 |
model | 手机型号 | |
pixelRatio | 设备像素比 | |
screenWidth | 屏幕宽度 | 1.1.0 |
screenHeight | 屏幕高度 | 1.1.0 |
windowWidth | 可使用窗口宽度 | |
windowHeight | 可使用窗口高度 | |
statusBarHeight | 状态栏的高度 | 1.9.0 |
language | 微信设置的语言 | |
version | 微信版本号 | |
system | 操作系统版本 | |
platform | 客户端平台 | |
fontSizeSetting | 用户字体大小设置。以“我-设置-通用-字体大小”中的设置为准,单位:px | 1.5.0 |
SDKVersion | 客户端基础库版本 | 1.1.0 |
示例代码:
wx.getSystemInfo({
success: function(res) {
console.log(res.model)
console.log(res.pixelRatio)
console.log(res.windowWidth)
console.log(res.windowHeight)
console.log(res.language)
console.log(res.version)
console.log(res.platform)
}
})
1. windowHeight
概念
可使用窗口高度,即:屏幕高度(
screenHeight
) - 导航(tabbar
)高度。
2. 存在问题
安卓设备下获取
windowHeight
不能准确得到对应的高度,总是拿到屏幕高度。
3. 原因
(1)同步接口 wx.getSystemInfoSync
并不同步(猜测)
wx.getSystemInfoSync
只是在页面初始化时提前计算。所以对于windowHeight
这种需要进行功能判断的属性,应该使用异步接口,实时获取。
(2)wx.getSystemInfo
调用的时机不当
上面讲了
windowHeight
的定义,所以这个值取决于tabbar
是否存在。为了保证
tabbar
显示后再进行取值,建议在生命周期的onReady
钩子中调用接口wx.getSystemInfo
。
4. 最终方案
在需要获取可使用窗口高度的对应js中, onReady
中调用wx.getSystemInfo
;
小程序 wx.getSystemInfoSync 获取 windowHeight 不准确的问题的更多相关文章
- 小程序 wx.getSystemInfoSync 获取 windowHeight 问题
windowHeight 概念 可使用窗口高度,即:屏幕高度(screenHeight) - 导航(tabbar)高度 存在问题 安卓设备下获取 windowHeight 不能准确得到对应的高度,总是 ...
- 微信小程序wx.getLocation()获取经纬度及JavaScript SDK调用腾讯地图API获取某一类地址
简介 腾讯位置服务为微信小程序提供了基础的标点能力.线和圆的绘制接口等地图组件和位置展示.地图选点等地图API位置服务能力支持,使得开发者可以自由地实现自己的微信小程序产品. 在此基础上,腾讯位置服务 ...
- 小程序wx.getUserInfo获取用户信息方案介绍
问题模块 框架类型 问题类型 API/组件名称 终端类型 操作系统 微信版本 基础库版本 API和组件 - - - - 背景 小程序一个比较重要的能力就是获取用户信息,也就是使用 wx.g ...
- 小程序wx.createInnerAudioContext()获取不到时长问题
最近在开发小程序中,需要用到音频播放功能.但在初始化时,使用InnerAudioContext.duration获取不到音频的时长. Page({ /** * 生命周期函数--监听页面初次渲染完成 * ...
- 微信小程序wx.login()获取openid,附:前端+后端代码
微信小程序开放了微信登录的api,无论是个人还是企业申请的小程序均可使用. 首先创建一个项目,把这些代码都清空,我们自己写! 然后,开始写了!首先index.wxml,写一个button用于发起登录 ...
- 微信小程序之动态获取元素宽高
我以前一直以为微信小程序不能动态获取view元素的宽高.但是自从看到: wx.createSelectorQuery() 这个api接口,以前的某些问题就能得到解决了... 那么,这个api接口怎么用 ...
- ***小程序wx.getUserInfo不能弹出授权窗口后的解决方案
微信更新api后,wx.getUserInfo在开发和体验版本都不能弹出授权窗口.微信文档说明: 注意:此接口有调整,使用该接口将不再出现授权弹窗,请使用 <button open-type=& ...
- 微信小程序案例:获取微信访问用户的openid
在微信开发项目中,获取openid是项目常遇的问题,本文通过主要讲解实现在微信小程序中如何获取用户的openid,案例实现非常简单 具体实现方法是通过登录接口获取登录凭证,然后通过request请求微 ...
- 【小程序+ thinkphp5】 获取微信运动数据
配置.请参看上篇文章.这里直接上代码 PHP 代码: //获取微信运动数据: public function test(){ $code = input("code"); $sig ...
随机推荐
- Mysql的utf8与utf8mb4区别,utf8mb4_bin、utf8mb4_general_ci、utf8mb4_unicode_ci区别
UTF-8是使用1~4个字节,一种变长的编码格式,字符编码.mb4即 most bytes 4,使用4个字节来表示完整的UTF-8. mysql的 utf8 编码最大字符长度为 3 字节,如果遇到 4 ...
- 【WebSocket】WebSocket快速入门
WebSocket介绍 WebSocket 是 HTML5 开始提供的一种在单个 TCP 连接上进行全双工通讯的协议. WebSocket 使得客户端和服务器之间的数据交换变得更加简单,允许服务端主动 ...
- Cannot start service WMSvc on computer '.'.
批处理,管理员权限执形 taskkill /im wmsvc.exe /f net stop WMSVC net start WMSVC pause
- 腾讯云短信 nodejs 接入, 通过验证码修改手机示例
腾讯云短信 nodejs 接入, 通过验证码修改手机示例 参考:腾讯云短信文档国内短信快速入门qcloudsms Node.js SDK文档中心>短信>错误码 nodejs sdk 使用示 ...
- KAFKA:如何做到1秒发布百万级条消息
http://rdcqii.hundsun.com/portal/article/709.html KAFKA是分布式发布-订阅消息系统,是一个分布式的,可划分的,冗余备份的持久性的日志服务.它主要用 ...
- 下载youtube视频到本地
https://www.clipconverter.cc/ 先通过上面的网站对youtube视频的url 进行解析获得下载链接地址 获得链接地址后 可通过阿里云香港服务器去下载 , 速度比较快 在阿里 ...
- Linux下用dd命令测试硬盘的读写速度
一.测试写速度: time dd if=/dev/zero of=/tmp/test bs=8k count=1000000 测试结果:565 MB/s 二.测试读速度: time dd if ...
- redis主从分节
概述 在现有企业中80%公司大部分使用的是redis单机服务,在实际的场景当中单一节点的redis容易面临风险. 面临问题 机器故障.我们部署到一台 Redis 服务器,当发生机器故障时,需要迁移到另 ...
- LeetCode 556. 下一个更大元素 III(Next Greater Element III)
556. 下一个更大元素 III 556. Next Greater Element III 题目描述 给定一个 32 位正整数 n,你需要找到最小的 32 位整数,其与 n 中存在的位数完全相同,并 ...
- kube-proxy运行机制分析【转载】
转自:http://blog.itpub.net/28624388/viewspace-2155433/ 1.Service在很多情况下只是一个概念,而真正将Service的作用实现的是kube-pr ...