微信小程序 获取window或某一节点的宽高

这篇具有很好参考价值的文章主要介绍了微信小程序 获取window或某一节点的宽高。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

一、获取window(宽口)的宽度和高度 (单位 :px)

异步方法:

wx.getSystemInfo({
  success: (result) => {
  	let windowWidth = result.windowWidth//获取window的宽度(单位px)
  	let windowHeight = result.windowHeight//获取window的高度(单位px)
  },
})

同步方法:

let result = wx.getSystemInfoSync()
let windowWidth = result.windowWidth//获取window的宽度(单位px)
let windowHeight = result.windowHeight//获取window的高度(单位px)

二、获取节点(元素)的宽度和高度 (单位 :px)

const query = wx.createSelectorQuery()
query.select('#container').boundingClientRect((result) => {
    console.log(result)
    let containerWidth = result.width//获取节点的宽度(单位px)
    let containerHeight = result.height//获取节点的宽度(单位px)
}).exec()

如果查询节点为自定义组件内容,则要使用 in() 方法

例如查找的节点为当前组件内容:wx.createSelectorQuery().in(this).select('#container')文章来源地址https://www.toymoban.com/news/detail-552384.html

到了这里,关于微信小程序 获取window或某一节点的宽高的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • matlab快速选择矩阵中的某一行或某一列

    先在工作区中找到你想看的变量,点进去,然后展现的就是变量矩阵的具体数值。 然后在上方找到“变量”这一栏,有一个要你输入“行数列数 ”的东西。 举例,你如果想看矩阵的(1183,40)这个数据,那你就输进去相应的数字。如果是看第1183行,那就输入(1183,:)。列就同理

    2024年02月12日
    浏览(40)
  • python取矩阵的某一行_Pythonnumpy提取矩阵的某一行或某一列的实例

    python取矩阵的某一行_Pythonnumpy提取矩阵的某一行或某一列的实例_weixin_39843677的博客-CSDN博客 最全--python取矩阵中的一个元素、某一行、特定位置元素_Mr DaYang的博客-CSDN博客_python获取矩阵中元素  

    2024年02月12日
    浏览(28)
  • 微信小程序(四) 节点查询 | wx.createSelectorQuery

    先看官方文档给出的说明 查 询 节 点 信 息 的 对 象 , 返 回 一 个 S e l e c t o r Q u e r y 对 象 实 例 color{#9a2323}{查询节点信息的对象,返回一个 SelectorQuery 对象实例} 查 询 节 点 信 息 的 对 象 , 返 回 一 个 S e l e c t o r Q u e r y 对 象 实 例 拿到实例后再看上边挂载的方法 Select

    2024年02月11日
    浏览(33)
  • 微信小程序获取openid,微信小程序获取手机号

    工具类

    2024年02月16日
    浏览(40)
  • 微信小程序code的获取微信小程序登录后code的获取

    先看以下几个问题: code是通过wx.login(Object object)接口返回的,看下官方的介绍:  简单点来说,这个code就是用来传到后端,后端通过该code可获取微信的openid,unionid等等,用来标识当前用户与微信的关联关系。 注意事项: 上面讲了微信code的获取以及一些事项,我们知道了使用

    2024年02月12日
    浏览(37)
  • 最新微信小程序获取头像昵称,直接用,uniapp获取微信小程序头像昵称

    微信小程序获取用户头像和昵称一个开放接口是wx.getUserInfo,2021年4月5日被废弃,原因是很多开发者在打开小程序时就通过组件方式唤起getUserInfo弹窗,如果用户点击拒绝,无法使用小程序,这种做法打断了用户正常使用小程序的流程,同时也不利于小程序获取新用户,后面新

    2024年02月11日
    浏览(29)
  • 【微信小程序】实现微信小程序登录(附源码)后端,微信小程序获取手机号

    登录简介 第一步:获取token 第二步:通过token拿用户信息 第三步:调用接口获取手机号 HttpClientUtil: WeChatUtil: controller层: service层: serviceImpl层: 登录简介        新版本微信小程序登录 是前端获取用户信息,不再是后端获取信息进行保存。所以后端要做的主要流程就是

    2024年04月23日
    浏览(40)
  • 微信小程序&会议OA-登录获取手机号流程&登录-小程序&导入微信小程序SDK(从微信小程序和会议OA登录获取手机号到登录小程序导入微信小程序SDK)

    目录 获取用户昵称头像和昵称 wx.getUserProfile bindgetuserinfo 登录过程 登录-小程序 wx.checkSession wx.login wx.request 后台 准备数据表 反向生成工具生成 准备封装前端传过来的数据 小程序服器配置 导入微信小程序SDK application.yml WxProperties WxConfig WxAuthController 登录-小程序 login.js user.j

    2024年02月04日
    浏览(36)
  • 微信小程序获取头像

    当小程序需要让用户完善个人资料时,可以通过微信提供的头像昵称填写能力快速完善。 根据相关法律法规,为确保信息安全,由用户上传的图片、昵称等信息微信侧将进行安全检测,组件从基础库2.24.4版本起,已接入内容安全服务端接口(mediaCheckAsync、msgSecCheck),以减少

    2024年02月16日
    浏览(30)
  • 微信小程序·获取小程序版本号

     小程序基础库版本  2.10.2  中提供了获取线上小程序版本号的功能,代码如下:  在app.js中 在需要引入版本号的页面js中:  要注意的是 线上小程序版本号仅支持在正式版小程序中获取,开发版和体验版中无法获取。 详情查看官方文档Object wx.getAccountInfoSync() | 微信开放文档

    2024年02月11日
    浏览(31)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包