问题
今天在开发小程序时遇到一个问题, 我需要获取页面某个元素信息时,通过官方方式获取获取不到元素
我的
lifetimes: {
attached: () => {
// 创建查询器
let _query = wx.createSelectorQuery();
// 查询元素
_query.select('#democlass').boundingClientRect()
.exec(eles => {
// 获取到元素信息
console.log(eles)
})
}
},
获取到得节点对象 null
解决
通过查询后得知解决问题的两个关键点
1、自定义组件中获取元素节点时不能使用wx.createSelectQuery(), 因为在自定义组件中此方法在this对象中了(使用this.createSelectQuery())
2、不能使用箭头函数, 因为this调用指向改变了
更改
lifetimes: {
attached: function () {
let _query = this.createSelectorQuery();
_query.select('#democlass').boundingClientRect()
.exec(eles => {
console.log(eles)
})
// _query.select() => 用于查询节点元素, 传入选择器信息
// _query.boundingClientRect() => 添加节点的布局位置的查询请求 在这里是查询所有元素信息
// _query.exec() => 执行所有的请求。请求结果按请求次序构成数组 得到指定查询信息
}
},
再次获取可以获取到节点信息
{id: "democlass", dataset: {…}, left: 10, right: 365.20001220703125, top: 150, …}