当前位置: 首页 > backend >正文

uniapp+vue3做小程序,获取容器高度

小程序获能用createSelectorQuery,如果是子组件,后面可以额外加一个参数in来指定获取dom的范围。小程序里面可以直接.in(this),但是vue3没有this了,那就只能通过getCurrentInstance去获取当前实例代替this ,注意这里需要用解构的方法把proxy引进来

		<view class="image-container">内容</view>import { ref, reactive, onMounted, nextTick, watch, getCurrentInstance } from 'vue';
const { proxy } = getCurrentInstance();
// 获取容器尺寸const getContainerSize = () => {new Promise((resolve, reject) => {let view = uni.createSelectorQuery().in(proxy);view.select('.image-container').boundingClientRect((data) => {containerWidth.value = data.width;containerHeight.value = data.height;console.log(data);resolve(data);}).exec();}).then((res) => {});};/ 组件挂载后初始化onMounted(async () => {await nextTick();getContainerSize();});

http://www.xdnf.cn/news/14659.html

相关文章:

  • 【开源工具】一键解决使用代理后无法访问浏览器网页问题 - 基于PyQt5的智能代理开关工具开发全攻略
  • OVS Faucet练习(下)
  • 【Linux指南】文件管理高级操作(复制、移动、查找)
  • 【基础篇-消息队列】——详解 RocketMQ 和 Kafka 的消息模型
  • VR看房:房地产数字化转型的核心引擎
  • RSYNC+IONTIFY数据实时同步
  • 二刷苍穹外卖 day03
  • MySQL基础函数篇
  • (C++)素数的判断(C++教学)(C语言)
  • 逻辑门电路Multisim电路仿真汇总——硬件工程师笔记
  • es中常规的根据字段查询时走什么索引(说明:「常规的根据字段查询」不包含分词查询)
  • 2025-06-22 思考-人的意识与不断走向死亡的过程
  • 文心一言(ERNIE Bot):百度打造的知识增强大语言模型
  • 端侧调用云存储实现头像存储
  • Redis快的原因
  • 扫雷中的数学原理
  • 如何用AI开发完整的小程序<9>—UI自适应与游戏页优化
  • 基于python代码的通过爬虫方式实现TK下载视频(2025年6月)
  • 【期末速成】编译原理
  • 【好用但慎用】Windows 系统中将所有 WSL 发行版从 C 盘迁移到 非系统 盘的完整笔记(附 异常处理)
  • C++ 中 QVector 的判断与操作
  • 【Linux第四章】gcc、makefile、git、GDB
  • TensorFlow 安装与 GPU 驱动兼容(h800)
  • 编程基础:调用访问
  • 【设计模式】4.代理模式
  • 基于YOLO的智能车辆检测与记录系统
  • `customRef` 在实战中的使用:防抖、计算属性缓存和异步数据获取
  • 【StarRocks系列】建表优化
  • SpringBoot电脑商城项目--显示勾选+确认订单页收货地址
  • ZooKeeper 3.9.2 集群安装指南