hooks taro 下拉刷新_小程序自定义下拉刷新（Taro版）

在考虑实现自定义的下拉刷新组件的时候，首先要明确，这个算是一种hack方案。并不是说自定义的有多么好，反而自定义的下拉刷新在android下会有细微的卡顿(我这种实现方式)。所以尽量还是用小程序自带的吧。

这个实现主要是参考艾伦大佬的组件。

实现方式

我们将页面分为下面的结构

正常的时候下拉刷新区域的高度为0。

然后我们通过scroll-view的scrollToUpeper事件来标记开始下滑。

通过touchstart来记录我们手指的初始位置。

通过监听列表区域的touchmove事件，来不断的计算手指移动距离。

touchend事件来触发更新事件。

我们将页面分为几种状态：

enum refreshStatus {

INIT,

PULL_DOWN,

READY_REFRESH,

LOADING,

DONE

}

复制代码

大致流程如下：

页面加载之后是INIT状态。

当触发了scroll-view的scrollToUpeper事件，我们记录一个标志位isUpper，在scroll-view的scroll事件触发时，isUpper记为false

当我们列表页滑倒顶部的时候再下拉，页面进入了PULL_DOWN状态。 一般会设置一个有效的下拉距离，称之为validHeight，当下拉的高度不足validHeight时，这时候松开手指，页面回弹不刷新。

当我们继续下拉，距离超过了validHeight这时候进入了READY_REFRESH状态。

在READY_REFRESH状