小程序 vant sticky 組件 offsetTop

問題

在當前版本 Vant weapp 組件庫中，sticky 組件 offsetTop 屬性類型爲 number，單位默認爲 px 且無法更改，而小程序默認單位是 rpx。這導致在一些場景下，如 sticky 的元素與頂部須保留一定距離，無法直接設置 offsetTop。

解決

通過小程序 API 獲取元素高度，動態設置 offsetTop，達到適配目的。

<van-sticky offset-top="{{offsetTop}}">

setOffsetTop() {
  wx.createSelectorQuery()
    .select('.banner')
    .fields(
      {
        size: true,
      },
      ({ height }) => this.setData({ offsetTop: height })
    ).exec()
}