Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
lzb_79
uni-app
提交
5ab96aac
U
uni-app
项目概览
lzb_79
/
uni-app
与 Fork 源项目一致
Fork自
DCloud / uni-app
通知
1
Star
1
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
U
uni-app
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
5ab96aac
编写于
7月 05, 2021
作者:
D
DCloud_LXH
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
fix: scroll-view refresh status triggers an error
上级
d9040348
变更
1
隐藏空白更改
内联
并排
Showing
1 changed file
with
92 addition
and
65 deletion
+92
-65
packages/uni-components/src/components/scroll-view/index.tsx
packages/uni-components/src/components/scroll-view/index.tsx
+92
-65
未找到文件。
packages/uni-components/src/components/scroll-view/index.tsx
浏览文件 @
5ab96aac
...
...
@@ -20,7 +20,7 @@ import { defineBuiltInComponent } from '@dcloudio/uni-components'
type
HTMLRef
=
Ref
<
HTMLElement
|
null
>
type
Props
=
ExtractPropTypes
<
typeof
props
>
type
RefreshState
=
'
refreshing
'
|
'
restore
'
|
'
pulling
'
|
''
type
RefreshState
=
'
refreshing
'
|
'
restore
'
|
'
pulling
'
|
'
refresherabort
'
|
'
'
type
Direction
=
'
x
'
|
'
y
'
interface
State
{
lastScrollTop
:
number
...
...
@@ -165,6 +165,7 @@ export default /*#__PURE__*/ defineBuiltInComponent({
<
div
class
=
"uni-scroll-view-refresh-inner"
>
{
refreshState
==
'
pulling
'
?
(
<
svg
key
=
"refresh__icon"
style
=
{
{
transform
:
'
rotate(
'
+
refreshRotate
+
'
deg)
'
,
}
}
...
...
@@ -180,6 +181,7 @@ export default /*#__PURE__*/ defineBuiltInComponent({
)
:
null
}
{
refreshState
==
'
refreshing
'
?
(
<
svg
key
=
"refresh__spinner"
class
=
"uni-scroll-view-refresh__spinner"
width
=
"24"
height
=
"24"
...
...
@@ -253,11 +255,11 @@ function useScrollViewLoader(
let
_innerSetScrollLeft
=
false
let
__transitionEnd
=
()
=>
{}
const
upperThresholdNumber
=
computed
(()
=>
{
var
val
=
Number
(
props
.
upperThreshold
)
let
val
=
Number
(
props
.
upperThreshold
)
return
isNaN
(
val
)
?
50
:
val
})
const
lowerThresholdNumber
=
computed
(()
=>
{
var
val
=
Number
(
props
.
lowerThreshold
)
let
val
=
Number
(
props
.
lowerThreshold
)
return
isNaN
(
val
)
?
50
:
val
})
...
...
@@ -402,14 +404,14 @@ function useScrollViewLoader(
console
.
error
(
`id error: scroll-into-view=
${
val
}
`
)
return
}
var
element
=
rootRef
.
value
!
.
querySelector
(
'
#
'
+
val
)
let
element
=
rootRef
.
value
!
.
querySelector
(
'
#
'
+
val
)
if
(
element
)
{
var
mainRect
=
main
.
value
!
.
getBoundingClientRect
()
var
elRect
=
element
.
getBoundingClientRect
()
let
mainRect
=
main
.
value
!
.
getBoundingClientRect
()
let
elRect
=
element
.
getBoundingClientRect
()
if
(
props
.
scrollX
)
{
var
left
=
elRect
.
left
-
mainRect
.
left
var
scrollLeft
=
main
.
value
!
.
scrollLeft
var
x
=
scrollLeft
+
left
let
left
=
elRect
.
left
-
mainRect
.
left
let
scrollLeft
=
main
.
value
!
.
scrollLeft
let
x
=
scrollLeft
+
left
if
(
props
.
scrollWithAnimation
)
{
scrollTo
(
x
,
'
x
'
)
}
else
{
...
...
@@ -417,9 +419,9 @@ function useScrollViewLoader(
}
}
if
(
props
.
scrollY
)
{
var
top
=
elRect
.
top
-
mainRect
.
top
var
scrollTop
=
main
.
value
!
.
scrollTop
var
y
=
scrollTop
+
top
let
top
=
elRect
.
top
-
mainRect
.
top
let
scrollTop
=
main
.
value
!
.
scrollTop
let
y
=
scrollTop
+
top
if
(
props
.
scrollWithAnimation
)
{
scrollTo
(
y
,
'
y
'
)
}
else
{
...
...
@@ -485,67 +487,90 @@ function useScrollViewLoader(
x
:
0
,
y
:
0
,
}
let
needStop
:
boolean
|
null
=
null
let
needStop
:
boolean
=
false
let
toUpperNumber
:
number
=
0
// 容器触顶时,此时鼠标Y轴位置
let
triggerAbort
:
boolean
=
false
let
beforeRefreshing
:
boolean
=
false
let
__handleTouchMove
=
function
(
event
:
TouchEvent
)
{
var
x
=
event
.
touches
[
0
].
pageX
var
y
=
event
.
touches
[
0
].
pageY
var
_main
=
main
.
value
!
if
(
needStop
===
null
)
{
if
(
Math
.
abs
(
x
-
touchStart
.
x
)
>
Math
.
abs
(
y
-
touchStart
.
y
))
{
// 横向滑动
if
(
self
.
scrollX
)
{
if
(
_main
.
scrollLeft
===
0
&&
x
>
touchStart
.
x
)
{
needStop
=
false
return
}
else
if
(
_main
.
scrollWidth
===
_main
.
offsetWidth
+
_main
.
scrollLeft
&&
x
<
touchStart
.
x
)
{
needStop
=
false
return
}
needStop
=
true
}
else
{
let
x
=
event
.
touches
[
0
].
pageX
let
y
=
event
.
touches
[
0
].
pageY
let
_main
=
main
.
value
!
if
(
Math
.
abs
(
x
-
touchStart
.
x
)
>
Math
.
abs
(
y
-
touchStart
.
y
))
{
// 横向滑动
if
(
self
.
scrollX
)
{
if
(
_main
.
scrollLeft
===
0
&&
x
>
touchStart
.
x
)
{
needStop
=
false
return
}
else
if
(
_main
.
scrollWidth
===
_main
.
offsetWidth
+
_main
.
scrollLeft
&&
x
<
touchStart
.
x
)
{
needStop
=
false
return
}
needStop
=
true
}
else
{
// 纵向滑动
if
(
self
.
scrollY
)
{
if
(
_main
.
scrollTop
===
0
&&
y
>
touchStart
.
y
)
{
needStop
=
false
return
}
else
if
(
_main
.
scrollHeight
===
_main
.
offsetHeight
+
_main
.
scrollTop
&&
y
<
touchStart
.
y
)
{
needStop
=
false
return
}
needStop
=
false
}
}
else
{
// 纵向滑动
if
(
self
.
scrollY
)
{
if
(
props
.
refresherEnabled
&&
_main
.
scrollTop
===
0
&&
y
>
touchStart
.
y
)
{
needStop
=
true
}
else
{
// 刷新时,阻止页面滚动
if
(
event
.
cancelable
!==
false
)
event
.
preventDefault
()
}
else
if
(
_main
.
scrollHeight
===
_main
.
offsetHeight
+
_main
.
scrollTop
&&
y
<
touchStart
.
y
)
{
needStop
=
false
return
}
needStop
=
true
}
else
{
needStop
=
false
}
}
if
(
needStop
)
{
event
.
stopPropagation
()
}
if
(
_main
.
scrollTop
===
0
&&
event
.
touches
.
length
===
1
)
{
// 如果容器滑动到达顶端,则进入下拉状态
state
.
refreshState
=
'
pulling
'
}
if
(
props
.
refresherEnabled
&&
state
.
refreshState
===
'
pulling
'
)
{
const
dy
=
y
-
touchStart
.
y
state
.
refresherHeight
=
dy
let
rotate
=
dy
/
props
.
refresherThreshold
if
(
rotate
>
1
)
{
rotate
=
1
if
(
toUpperNumber
===
0
)
{
toUpperNumber
=
y
}
if
(
!
beforeRefreshing
)
{
state
.
refresherHeight
=
y
-
toUpperNumber
// 之前为刷新状态则不再触发pulling
if
(
state
.
refresherHeight
>
0
)
{
triggerAbort
=
true
trigger
(
'
refresherpulling
'
,
event
,
{
deltaY
:
dy
,
})
}
}
else
{
rotate
=
rotate
*
360
state
.
refresherHeight
=
dy
+
props
.
refresherThreshold
// 如果之前在刷新状态,则不触发刷新中断
triggerAbort
=
false
}
state
.
refreshRotate
=
rotate
trigger
(
'
refresherpulling
'
,
event
,
{
deltaY
:
dy
,
})
const
route
=
state
.
refresherHeight
/
props
.
refresherThreshold
state
.
refreshRotate
=
(
route
>
1
?
1
:
route
)
*
360
}
}
let
__handleTouchStart
=
function
(
event
:
TouchEvent
)
{
...
...
@@ -553,18 +578,10 @@ function useScrollViewLoader(
disableScrollBounce
({
disable
:
true
,
})
needStop
=
null
touchStart
=
{
x
:
event
.
touches
[
0
].
pageX
,
y
:
event
.
touches
[
0
].
pageY
,
}
if
(
props
.
refresherEnabled
&&
state
.
refreshState
!==
'
refreshing
'
&&
main
.
value
!
.
scrollTop
===
0
)
{
state
.
refreshState
=
'
pulling
'
}
}
}
let
__handleTouchEnd
=
function
(
event
:
TouchEvent
)
{
...
...
@@ -576,10 +593,20 @@ function useScrollViewLoader(
disable
:
false
,
})
if
(
state
.
refresherHeight
>=
props
.
refresherThreshold
)
{
state
.
refresherHeight
=
props
.
refresherThreshold
state
.
refreshState
=
'
refreshing
'
// 之前是刷新状态则不再触发刷新
if
(
beforeRefreshing
)
return
beforeRefreshing
=
true
_setRefreshState
(
'
refreshing
'
)
}
else
{
state
.
refresherHeight
=
0
trigger
(
'
refresherabort
'
,
event
,
{})
beforeRefreshing
=
false
state
.
refreshState
=
'
refresherabort
'
state
.
refresherHeight
=
toUpperNumber
=
0
if
(
triggerAbort
)
{
triggerAbort
=
false
trigger
(
'
refresherabort
'
,
event
,
{})
}
}
}
main
.
value
!
.
addEventListener
(
...
...
@@ -587,7 +614,7 @@ function useScrollViewLoader(
__handleTouchStart
,
passiveOptions
)
main
.
value
!
.
addEventListener
(
'
touchmove
'
,
__handleTouchMove
,
passiveOptions
)
main
.
value
!
.
addEventListener
(
'
touchmove
'
,
__handleTouchMove
)
main
.
value
!
.
addEventListener
(
'
scroll
'
,
__handleScroll
,
passiveOptions
)
main
.
value
!
.
addEventListener
(
'
touchend
'
,
__handleTouchEnd
,
passiveOptions
)
initScrollBounce
()
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录