微信小程序计算scroll-view的高度

在小程序里面如果用到scroll-view，就会看到这样一句话

使用竖向滚动时，需要给<scroll-view/>一个固定高度，通过 WXSS 设置 height。

这是官方给出的文档，所以我们通常的做法这样的

<scroll-view scroll-y="true" style="height:{{scrollHeight}}px;">

在wxml文件里面定义高度，然后通过

wx.getSystemInfo({      success: function (res) {        console.info(res.windowHeight);        that.setData({          scrollHeight: res.windowHeight        });      }    });

这个不是我今天要说的，我今天要说的是如果有头部怎么办？如何把头部的高度获取出来，并减掉头部的距离：

wx.createSelectorQuery().select('#the-id').boundingClientRect(function(rect){      rect.id      // 节点的ID      rect.dataset // 节点的dataset      rect.left    // 节点的左边界坐标      rect.right   // 节点的右边界坐标      rect.top     // 节点的上边界坐标      rect.bottom  // 节点的下边界坐标      rect.width   // 节点的宽度      rect.height  // 节点的高度    }).exec()

官方有这样一个api，然后把代码改成这样

    wx.getSystemInfo({      success: function (res) {        console.info(res.windowHeight);        let height = res.windowHeight;        wx.createSelectorQuery().selectAll('.search-bar').boundingClientRect(function (rects) {          rects.forEach(function (rect) {            that.setData({              scrollHeight: res.windowHeight - rect.bottom            });          })        }).exec();      }    });

标红的地方是那个节点的class名字。

就到这。