fix(pull-refresh): fix pull up (#1235)

* fix(pull-refresh): 优化上拉加载更多触发逻辑

Signed-off-by: jacknan <zhumaonan@aliyun.com>

* fix(pull-refresh): 常量定义

Signed-off-by: jacknan <zhumaonan@aliyun.com>

---------

Signed-off-by: jacknan <zhumaonan@aliyun.com>

packages/renderless/src/pull-refresh/index.ts

@@ -12,6 +12,9 @@
 
 import { on, off } from '../common/deps/dom'
 
+// 上拉触发事件超时时间
+const PULL_UP_TIME_OUT = 300
+
 export const initPullRefresh =
   ({ t, props, state }) =>
   () => {
@@ -37,19 +40,11 @@ export const onTouchstart = (state) => (event) => {
 export const onTouchmove =
   ({ state, refs }) =>
   (event) => {
-    if (event.touches[0].clientY < state.draggposition) {
-      pullUpTouchMove(state)
-    } else {
+    if (event.touches[0].clientY > state.draggposition) {
       pullDownTouchMove(state, refs, event)
     }
   }
 
-export const pullUpTouchMove = (state) => {
-  if (state.disabledPullUp || state.pullUpLoading || !state.hasMore) {
-    return
-  }
-}
-
 export const pullDownTouchMove = (state, refs, event) => {
   if (state.disabledPullDown || state.pullDownLoading) {
     return
@@ -92,7 +87,9 @@ export const pullDownTouchEnd = (api, state, emit) => {
 }
 
 export const pullUpTouchEnd = (state, emit, refs) => {
-  setTimeout(() => {
+  clearTimeout(state.timer)
+
+  state.timer = setTimeout(() => {
     const footNode = refs.foot
 
     if (!state.hasMore || !footNode) {
@@ -106,9 +103,15 @@ export const pullUpTouchEnd = (state, emit, refs) => {
       emit('update:modelValue', true)
       emit('pullUp')
     }
-  }, 300)
+  }, PULL_UP_TIME_OUT)
 }
 
+export const onScroll =
+  ({ state, emit, refs }) =>
+  () => {
+    pullUpTouchEnd(state, emit, refs)
+  }
+
 export const mountedHandler =
   ({ api, refs }) =>
   () => {
@@ -117,6 +120,7 @@ export const mountedHandler =
     on(track, 'touchstart', api.onTouchstart)
     on(track, 'touchmove', api.onTouchmove)
     on(track, 'touchend', api.onTouchend)
+    on(track, 'scroll', api.onScroll)
   }
 
 export const beforeUnmountHandler =
@@ -127,6 +131,7 @@ export const beforeUnmountHandler =
     off(track, 'touchstart', api.onTouchstart)
     off(track, 'touchmove', api.onTouchmove)
     off(track, 'touchend', api.onTouchend)
+    off(track, 'scroll', api.onScroll)
   }
 
 export const handlerModelValue =

packages/renderless/src/pull-refresh/vue.ts

@@ -17,6 +17,7 @@ import {
   onTouchstart,
   onTouchmove,
   onTouchend,
+  onScroll,
   initPullRefresh,
   clearPullRefresh
 } from './index'
@@ -45,7 +46,8 @@ export const renderless = (props, { watch, onMounted, reactive, onBeforeUnmount
     animationDuration: props.animationDuration,
     disabledPullDown: props.disabledPullDown,
     disabledPullUp: props.disabledPullUp,
-    pullUpDistance: typeof props.pullUpDistance === 'string' ? Number(props.pullUpDistance) : props.pullUpDistance
+    pullUpDistance: typeof props.pullUpDistance === 'string' ? Number(props.pullUpDistance) : props.pullUpDistance,
+    timer: null
   })
 
   Object.assign(api, {
@@ -53,6 +55,7 @@ export const renderless = (props, { watch, onMounted, reactive, onBeforeUnmount
     onTouchstart: onTouchstart(state),
     onTouchmove: onTouchmove({ state, refs }),
     onTouchend: onTouchend({ api, props, state, emit, refs }),
+    onScroll: onScroll({ state, emit, refs }),
     mountedHandler: mountedHandler({ api, refs }),
     beforeUnmountHandler: beforeUnmountHandler({ api, refs }),
     handlerModelValue: handlerModelValue({ api, state }),