uniapp开发：uniapp之vue3.2获取节点信息的差异
uniapp开发的时候，可能会有获取dom节点信息的需求，在uniapp的vue2.X编译模式中可以直接通过API const query = uni.createSelectorQuery().in(this);去获取相关的节点信息。在vue3.2+中这段代码是会报如下错误：
原因分析：
其实从这个错误是看不出什么原因，于是进一步思索。我们知道vue2.x中是在uni.createSelectorQuery()后缀了.in(this)，但是在vue3.x的<script setup></setup>中的this就不好使了，压根儿就没有this这个东西了，所以报错大概就是这个this惹的祸，接下来做个验证。
验证分析：**
直接把代码中的.in(this)去掉
<template>
<view class="myView" style="background-color: pink;" id="myView">我是方脑壳</view>
</template>
<script setup>
const query = uni.createSelectorQuery();
query.select('#myView').boundingClientRect(data => {
console.log("得到布局位置信息：",data);
}).exec();
</script>
<style>
.myView {
width: 100px;
height: 100px;
}
</style>
结果分析
上面验证中的打印结果：
{
bottom: 121,
dataset: {},
height: 100,
id: "myView",
left: 0,
right: 100,
top: 21,
width: 100
}
没有报错，而且打印出了正确的结果，证明原因分析是没问题的。只是在uniapp的官方API中还没有做相关的说明，所以可能一开始会进入误区导致有些功能不能实现。
所以在uniapp的vue3.2+开发中，获取节点信息等相关API要记得抛弃this，避免走弯路。
----- 看完啦别忘记点赞哟，您的肯定就是对我最大的支持 END -----
关注我，不迷路
如果任何疑问的可以在评论区留言，还可以加QQ群交流：568984539，加群备注‘地区-名字-技术类型’。
更多前端等相关知识可关注我个人博客：https://blog.csdn.net/qq_42961150?spm=1011.2124.3001.5343
个人作品收藏：https://mp.weixin.qq.com/s/8hZjCRfjcFuSk-YRzRUn6g