小程序点击返回顶部

wxml

<image src=‘../../images/agoproduct/totop.png‘ class=‘goTop‘ hidden=‘{{!floorstatus}}‘ bindtap="goTop"></image>

wxss

/* 返回顶部 */
.goTop{
    height: 72rpx;
    width: 72rpx;
    position: fixed;
    bottom: 26rpx;
    right: 31rpx;
  }

js

 data: {
    // 返回顶部
    floorstatus: true
  },
  
// 获取滚动条当前位置
onPageScroll: function (e) {
  console.log(e)
  if (e.scrollTop > 150) {
    this.setData({
      floorstatus: true
    });
  } else {
    this.setData({
      floorstatus: false
    });
  }
},
//回到顶部
goTop: function (e) {  // 一键回到顶部
  if (wx.pageScrollTo) {
    wx.pageScrollTo({
      scrollTop: 0
    })
  } else {
    wx.showModal({
      title: ‘提示‘,
      content: ‘当前微信版本过低,无法使用该功能,请升级到最新微信版本后重试。‘
    })
  }
},

 

<image src=‘../../images/agoproduct/totop.png‘ class=‘goTop‘ hidden=‘{{!floorstatus}}‘ bindtap="goTop"></image>

小程序点击返回顶部

上一篇:2021.09.17测试随笔


下一篇:[Cocos2d-x]解决Android平台ndk-build时不自动删除外部库