小程序实现点击返回顶部

版权声明：转载请附上原文链接。 https://blog.csdn.net/wang1006008051/article/details/82144098

1、wxml里先放一个点击返回顶部的按钮，固定定位

<image src='../../img/top.png' class='goTop' hidden='{{showTop}}' bindtap='goTop'></image>

.goTop{position: fixed;bottom: 20px;right: 15px;width: 32px;height: 32px;}

2、Page里的代码：

  onPageScroll: function (e) {
    console.log(e.scrollTop)
    if (e.scrollTop>300) {
      this.setData({
        showTop: false
      })
    } else {
      this.setData({
        showTop: true
      })
    }
  },
  goTop: function () {
    wx.pageScrollTo({
      scrollTop: 0,
      duration: 300
    })
  }