手把手教你学会判断用户在做向上滑动还是向下滑动
知识回调(不懂就看这儿!)
有关微信小程序的相关知识可以前往微信小程序官方文档查看了解!!
场景复现
在上期文章中,我们简单介绍了如何监听页面滑动,但是在文章的最后留下了一个问题。我们如何判断用户是在做上滑操作还是下滑操作?本期文章将用两种方法(onPageScroll或者touchstart、touchmove、touchend)解决这个问题。
监听效果:
我们能发现,监听之后,上滑控制台会打印“上滑”,下滑控制台会显示“下滑”。
核心干货
onPageScroll结合scrollTop实现
在上期文章中,关于onPageScroll的用法已经介绍的很全面了。这里的话就直接写逻辑层的内容。
首先我们能监听页面变化的参数只有scrollTop,所以我们需要从scrollTop的变化下手。在上期文章中,我们发现当页面上滑时scrollTop递增,页面下滑时scrollTop递减。所以我们可以通过判断scrollTop的变化来判断用户的动作。
data:{
scrollTopArr:<number[]>[]
}
onPageScroll: function(e) {
var that = this</