vue页面获取元素,

app端推荐(这个也兼容H5)

//设置mescroll的高度setTimeout(()=>{const  query = uni.createSelectorQuery().in(this)query.select('.plane-once').boundingClientRect(data=>{console.log('.plane-once',data);uni.getSystemInfo({success:(res) => {//当前组件的高 data.height let uselyHeight = Math.ceil((data.height / res.windowHeight) * 100 ) ;this.listHeight = 100 - uselyHeight;this.listHeight = this.listHeight + '%';console.log('listHeight',this.listHeight);//重新渲染组件  动态设置height 需要重新渲染this.scrollShow = false;this.$nextTick(() => {this.scrollShow = true;})}})}).exec()},400)

H5使用 : this.$refs.$el

nvue页面获取dom元素高度

H5端使用:

1.this.$refs.name

app端使用:

这种方式 ,对于内部子元素多的情况下,无法很好的获取

2.使用weex

const dom = weex.requireModule('dom');dom.getComponentRect(this.$refs.leftMenu,option => {console.log(option.size.height);this.rightMenuHeight = option.size.height})

uniapp 动态获取元素高度相关推荐

  1. Vue 动态获取元素高度

    getTitleHeight() { this.$nextTick(function () { this.contentHeight = document.getElementsByClassName ...

  2. uniapp 获取图片的高度_uni-app获取元素高度等信息,并设置元素top信息

    本文主要简介uni-app获取元素信息及设置信息等 获取元素高度 可查看官方文档 mounted() { const query = uni.createSelectorQuery().in(this ...

  3. uniapp获取元素高度

    uniapp获取元素高度 官方文档 mounted() {const query = uni.createSelectorQuery().in(this);query.select('#editor' ...

  4. 微信小程序view动态长度_微信小程序实现动态获取元素宽高的方法分析

    本文实例讲述了微信小程序实现动态获取元素宽高的方法.分享给大家供大家参考,具体如下: 我以前一直以为微信小程序不能动态获取view元素的宽高.但是自从看到: wx.createSelectorQuer ...

  5. 原生js——无法获取元素高度的的问题

    原生js--无法获取元素高度的的问题 今天遇到了xxx.style.width无法获取元素宽度的问题,原来一直没有注意到这个小细节: 1)如果width:150px:是写在 css 样式表(外链式)里 ...

  6. 原生js获取元素高度

    原生js获取元素高度 <div id='container'></div> let dom = document.getElementById('contanier')dom. ...

  7. 微信小程序获取页面元素高度_微信小程序之动态获取元素宽高

    我以前一直以为微信小程序不能动态获取view元素的宽高.但是自从看到: wx.createSelectorQuery() 这个api接口,以前的某些问题就能得到解决了... 那么,这个api接口怎么用 ...

  8. uniapp 动态获取手机屏幕高度

    uniapp 动态获取屏幕高度再减去已有元素的高度等于剩下元素高度 uni.getSystemInfo({success: res => {this.screenHeight = (res.sc ...

  9. uniapp 获取元素高度

    在 uniapp 中,你可以使用 wx.createSelectorQuery() 方法来获取元素的高度.首先,你需要在元素上添加唯一的 id,然后在你的 JavaScript 代码中使用以下代码来获 ...

最新文章

  1. 用 Flask 来写个轻博客 (7) — (M)VC_models 的关系(many to many)
  2. html 导航右侧弹出层,CSS导航栏及弹窗示例代码
  3. python 文本聚类算法
  4. tp5缓存在html怎么用,tp5.1缓存Cache的使用
  5. ASIHTTPRequest 简单使用
  6. C#LeetCode刷题之#893-特殊等价字符串组​​​​​​​​​​​​​​(Groups of Special-Equivalent Strings)
  7. 助老打车暖心车站落地杭州 帮助老年人扫码一键叫车
  8. rust腐蚀怎么单人游戏_腐蚀RUST怎么提高帧数_腐蚀RUST提高FPS方法_52pk单机游戏
  9. 电路布线(动态规划C++实现)
  10. 自我管理 写好工作周报
  11. 如何成为一个合格的数据分析师
  12. figtree需要在JAVA下运行吗,科学网—Inno setup 制作安装文件以编译FigTree为例 - 张金龙的博文...
  13. 如何使用python合并多个excel文件
  14. Web前端学习笔记07:CSS_高级技巧_定位
  15. Ubuntu22.04.1无法找到Ubuntu软件中心-Ubuntu Software
  16. IEC61131-3标准的基本概念和定义
  17. Centos 显示隐藏文件
  18. 脸打肿都不要忘了呀,Java 重写时应当遵守的 11 条规则!!
  19. GSP药品经营质量管理认证的要求?
  20. 原生js通过canvas和cssRules实现图片分割与重组

热门文章

  1. 物联网开发笔记(94)- 使用Micropython开发ESP32开发板之获取天气数据并用ILI9341屏幕显示
  2. 【转】SQL decode 函数的用法
  3. 一、web安全入门基础知识
  4. 阻塞IO、非阻塞IO的区别
  5. 乘法原理的例题和答案_小学四年级奥数加法原理与乘法原理的基础练习题
  6. 坚果云和亿方云相比较哪个好?
  7. Python全栈工程师要掌握的五种知识
  8. stacking的详细代码教程
  9. 22 个必知编程语言之「Kotlin」
  10. 马斯克讽刺疫情恐慌“愚蠢”遭怒怼!苹果、谷歌、微软等硅谷巨头近10万名员工已回家工作...