uniapp 记录注意事项

刺骨的言语ヽ痛彻心扉 2021-07-24 15:23 509阅读 0赞

### 1.uniapp无法使用js的dom节点操作拿到节点对象，也无法使用vue的ref语法拿到节点对象 ###

解决：使用uniapp的官方的api

uni.createSelectorQuery().selectViewport().scrollOffset(res => { 
      console.log("竖直滚动位置" + res.scrollTop);
    }).exec();
    
    let view = uni.createSelectorQuery().in(this).select(".test");
    
    view.fields({ 
      size: true,
      scrollOffset: true
    }, data => { 
      console.log("得到节点信息" + JSON.stringify(data));
      console.log("节点的宽为" + data.width);
    }).exec();
    
    view.boundingClientRect(data => { 
      console.log("得到布局位置信息" + JSON.stringify(data));
      console.log("节点离页面顶部的距离为" + data.top);
    }).exec();

我写的微信小程序用微信小程序的api

const query = wx.createSelectorQuery().in(this)
    query.selectAll('#tab-bar').boundingClientRect()
    query.exec(function (res) { 
    	console.log(res)
    })

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDYwMTk0OA_size_16_color_FFFFFF_t_70]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDYwMTk0OA_size_16_color_FFFFFF_t_70]: /images/20210724/d5e58e2233954537a52727e40f6354f9.png

发表评论取消回复

表情：

评论列表（有 0 条评论，509人围观）

还没有评论，来说两句吧...

相关阅读

相关使用Uniapp开发小程序注意事项

1. 在新增页面之后，需要重新运行小程序，才可生效，点击运行-运行到小程序模拟器-微信开发者工具 ![20210428105827332.png][] 未完待续

朱雀/ 2023年01月17日 08:47/ 0 赞/ 136 阅读

相关 8.(2)uniapp中v-for案例以及注意事项

<view>  <

蔚落/ 2022年11月17日 13:59/ 0 赞/ 147 阅读

相关 uniapp关于使用 Android 离线打包的注意事项

Android 离线打包文档地址： [https://nativesupport.dcloud.net.cn/AppDocs/usesdk/android][https

梦里梦外;/ 2022年10月06日 05:58/ 0 赞/ 231 阅读

相关 Python 注意事项

[Python 注意事项][Python] 1、tuple：元组 a.元组一旦初始化就不可修改。不可修改意味着tuple更安全。如果可能，能用tuple代替list就尽

﹏ヽ暗。殇╰゛Y/ 2022年03月22日 10:40/ 0 赞/ 379 阅读

相关 JS注意事项

一、ECMAScript 1、数组相关 1.1 如果数组中的某一项的值是null 或者undefined，那么该值在join()、toLocaleString()

小咪咪/ 2022年01月31日 02:59/ 0 赞/ 375 阅读

相关 getRealPath注意事项

// getRealPath寻找到的不是真实文件的路径，所以打印的就不是真实文件的地址，但是能打印出来地址 String realPath = servl

迷南。/ 2021年11月22日 08:34/ 0 赞/ 372 阅读

相关 uniapp微信登录注意事项（app端）

真机调试设置 1、manifest.json app模块权限配置选择oauth(登录鉴权) ![在这里插入图片描述][watermark_type_ZmFuZ3

本是古典何须时尚/ 2021年09月28日 03:46/ 0 赞/ 667 阅读

相关 ARCEngine注意事项

目录 1.vs选择2012版。 2.地图最好用相对路径加载。并且arcmap在打开时，先在：【File】-【Map Document Properties...

约定不等于承诺〃/ 2021年09月17日 08:26/ 0 赞/ 641 阅读

相关 uniapp 电商app vuex的处理方案及注意事项

vuex：组件间数据通信在电商app中，会有各种各样的广告，为了能够保证各个组件都能够调用广告信息，最简单的处理方式就是通过vuex； vuex的官方说法 Vue

拼搏现实的明天。/ 2021年07月25日 22:34/ 0 赞/ 619 阅读

相关 uniapp 记录注意事项

1.uniapp无法使用js的dom节点操作拿到节点对象，也无法使用vue的ref语法拿到节点对象解决：使用uniapp的官方的api uni.cre

刺骨的言语ヽ痛彻心扉/ 2021年07月24日 15:23/ 0 赞/ 510 阅读