在做一个滚动到指定位置的动能时(wx.pageScrollTo),想获取某个元素的定位,使用wx.createSelectorQuery().exec()。
运行官方demo代码时,查找id为'empty'的元素,在回调中打印结果,为什么res[0]是null,而第二次调用时才有结果?
Page({
queryMultipleNodes: function(){
var query = wx.createSelectorQuery()
query.select('#empty').boundingClientRect()
query.selectViewport().scrollOffset()
query.exec(function(res){
console.log(res)
res[0].top // #the-id节点的上边界坐标 这里是null
res[1].scrollTop // 显示区域的竖直滚动位置
})
}
})
页面渲染时间,onLoad > onShow > onReady, 如果页面由动态数据加载渲染,有可能是数据还没有渲染成功。onReady代表页面框架加载完毕,此时数据渲染不一定完成,可以用 setTimeout 延迟获取
被同样的问题折磨了好久,测试情况如下:
在Page的onLoad、onReady、onShow等事件中调用,均返回null
如果在操作事件回调中(比如在某个按钮的bindtap中调用),则可以正常返回数据
初步判断,应该是页面较为复杂时,onLoad、onReady、onShow等事件均不能保证想要获取的节点已经载入,所以获取不到。
有的人使用定时器来解决,也就是页面载入后延时几秒钟才去获取,但我觉得这种方法太丑陋了,而且依然有失败的可能。
我的解决方案是在某个耗时较久的异步事件的成功回调中调用,比如我要动态计算高度的view是用于装载某个数据列表的,那么我就在获取这个异步数据的成功回调中获取所需计算的wxml节点的信息,然后再设置所需的高度。