小程序点击返回顶部

工作日志 随手笔记 进攻

小程序点击返回顶部_第1张图片

 ='scrollTop' style="height:{{clientHeight}}px;" scroll-y="true" scroll-top='{{scroll}}'>
   
    
  
    
  

 内容我没有写 我只是把图标放进去了 


通过这个属性 判断是否滚动 通过滚动距离来判断什么时候隐藏和显示

小程序点击返回顶部_第2张图片

data:{
    scroll:0,
    hiddentop:false,
}
  // 点击返回顶部
  gotop:function(e){
    this.setData({
      scroll:0
    })
  },
  scrollTop:function(e){
    console.log(e.detail.scrollTop) //如果没有输出结果可能是你scroll-view 嵌套的不对 

    var hiddentop = this.data.hiddentop;
    if (e.detail.scrollTop > 10){ //如果距离顶部10 显示返回顶部标签
      this.setData({
        hiddentop:true
      })
   }else{
     this.setData({
       hiddentop: false
     })
   }
  },



你可能感兴趣的:(工作日志)