uniapp中refs获取打印是空对象{}的解决办法

场景复现

版本如下:

"@dcloudio/uni-app": "2.0.2-3080720230703001",

"vue": ">= 2.6.14 < 2.7",

开发中发现只要是view这些原始标签的ref都无法在任何地方获取到refs.xxx, 而组件标签如 这种加ref就能获取到. 

解决办法

用如下代码平替this.refs, 标签中的ref改为id

 

获取实例js方法如下:

const item = this.createSelectorQuery().in(this).select("#item_0"); // 通过id获取实例
item.boundingClientRect((data) => { // 获取实例边界属性
        console.log(data)
}).exec();

写在最后

截止目前不知道为什么this.$refs打印一直是空对象, 给到组件的ref就能获取实例, 给到view标签的都不行