微信小程序 简单获取屏幕视口高度
由于小程序的宽度是固定的 750rpx,我们可以先用wx.getSystemInfo 来获取可使用窗口的宽高(并非rpx),结合750rpx的宽度算出比例,再用比例来算出高度
let that = this;
// 获取系统信息
wx.getSystemInfo({
success: function (res) {
// 获取可使用窗口宽度
let clientHeight = res.windowHeight;
// 获取可使用窗口高度
let clientWidth = res.windowWidth;
// 算出比例
let ratio = 750 / clientWidth;
// 算出高度(单位rpx)
let height = clientHeight * ratio;
// 设置高度
that.setData({
height: height
});
}
});
微信小程序 简单获取屏幕视口高度的更多相关文章
- 微信小程序后台获取用户的opeid
1.微信小程序后台获取登录用户的openid,首先微信小程序将code传给后台服务器 wx.login({ success: function (res) { var code = res.code ...
- 【微信小程序】获取用户地理位置权限,二次请求授权,逆解析获取地址
摘要:微信小程序内获取用户地理位置信息授权,被拒绝后二次获取,获取权限后逆解析得到用户所在省市区等.. 场景:商城类小程序,在首页时需展示附近门店,即用户刚进入小程序时就需要获取到用户位置信息 ste ...
- 微信小程序如何获取openid
微信小程序如何获取openid wx.login({ success: res => { // 发送 res.code 到后台换取 openId, sessionKey, unionId // ...
- 微信小程序验证码获取倒计时
wxml <button disabled='{{disabled}}' bindtap="goGetCode">{{code}}</button> js ...
- 微信小程序,获取二维码
微信小程序,获取二维码 找到一篇很实用的博客,他已经写得很详细了,自己也懒得写,亲测有效 参考网址
- 微信小程序简单封装图片上传组件
微信小程序简单封装图片上传组件 希望自己 "day day up" -----小陶 我从哪里来 在写小程序的时候需要上传图片,个人觉得官方提供的 Uploader 组件不是太好用, ...
- nodejs+koa+uniapp实现微信小程序登陆获取用户手机号及openId
nodejs+koa+uniapp实现微信小程序登陆获取用户手机号及openId 前言: 我准备用nodejs+koa+uniapp实现一款餐饮点单小程序,以及nodejs+koa+vue实现后端管理 ...
- 微信小程序中获取高度及设备的方法
由于js中可以采用操纵dom的方法来获取页面元素的高度,可是在微信小程序中不能操纵dom,经过查找之后发现仅仅只有以下几个方法可以获取到高度 wx.getSystemInfoSync().window ...
- 微信小程序简单入门1
参考文档:https://mp.weixin.qq.com/debug/wxadoc/dev/index.html 1 创建项目 开发者工具安装完成后,打开并使用微信扫码登录.选择创建"项 ...
随机推荐
- Rasa init报错:AttributeError: type object 'Callable' has no attribute '_abc_registry'
错误:Rasa init --no-prompt 报错 原因:Python升级到3.7后会遇到该问题 解决:pip uninstall typing
- flask之CORS跨域请求处理
from flask import Flask from flask_cors import CORS#pip install Flask-CORS#跨域请求模块 app = Flask(__name ...
- nginx配置之代理功能
nginx代理功能 至少需要两台主机: 代理机配置----如下: yum安装的/etc/nginx/nginx.conf location / { #服务机的ip端口 proxy_pass http: ...
- Webconfig配置刷新时间,前台页面调用这个时间
<configuration> <appSettings> <add key="webpages:Version" value="2.0.0 ...
- 201771010128王玉兰《面向对象程序设计(Java)》第十二周学习总结
第一部分:理论知识 1.AWT与Swing简介 (1)Swing用户界面库是非基于对等体的GUI工具箱. Swing具有更丰富并且更方便的用户界面元素集合. Swing对底层平台的依赖很少,因此与 ...
- 【NLP】老司机带你入门自然语言处理
自然语言处理是一门用于理解人类语言.情感和思想的技术,被称为是人工智能皇冠上的明珠. 随着深度学习发展,自然语言处理技术近年来发展迅速,在技术上表现为BERT.GPT等表现极佳的模型:在应用中表现为c ...
- 微信小程序订阅
微信小程序订阅 摘要 1.基于promise封装微信小程序订阅 2.解决由于微信基础库版本低下的兼容 3.解决“总是保持以上选择,不再询问”的取消状态 主要运用API: requestSubscrib ...
- 第 7 篇:文章详情的 API 接口
作者:HelloGitHub-追梦人物 一旦我们使用了视图集,并实现了 HTTP 请求对应的 action 方法(对应规则的说明见 使用视图集简化代码),将其在路由器中注册后,django-restf ...
- 【QT】利用pyqt5实现简单界面
Topic: 利用pyqt5编写简单界面Env:win10 + Pycharm2018 + Python 3.6.8Date: 2019/4/29 by hw_Chen2018 ...
- STM32读取Guidance数据——Guidance SDK
更新记录:2019/11/14 更新STM32(F407VET6)读取Guidance数据 Github地址. 背景:想要将祖传的Guidance用于DJI A3/新固件的N3飞控.DJI已经停 ...