如何在小程序中加上一个底部回顶功能

不是那种简单的>多少而是要根据页面算出距离显示和隐藏

上面是一个样式,添加了事件和判断,但是要注意下面方法的scrollTop 与scroll-view中的 属性相结合

/**

* 回到顶部方法很简单

*/

onTapMove: function () {

this.setData({

scrollTop: 0

})

}

而判断if是否为真,可以结合scroll-view 中的bindscroll="timeScroll"事件来监听滚动

timeScroll(e){//这里的e可以拿到当前元素的距离参数,然后可以当作showTop的入参

let scrollT = e.detail.scrollTop

this.showTop(scrollT) 

},

showTop: function (scrollT) {

let screenHeight = this.data.screenH * 2//这里的screenH根据下面小程序原生获取设备信息方法获取

if (scrollT > screenHeight) {

this.setData({

showToTop: true

})

} else {

this.setData({

showToTop: false

})

}

},

/**

* 获取设备信息 通过wx.getSystemInfo()

*/

getSystemInfo: function () {

let vm = this

wx.getSystemInfo({

success: function (res) {

vm.setData({

screenH: Number(res.windowHeight),

screenW: Number(res.windowWidth)

})

}

})

},

ok了