Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
京东前端
nutui
提交
30793656
N
nutui
项目概览
京东前端
/
nutui
通知
37
Star
4
Fork
1
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
N
nutui
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
30793656
编写于
2月 20, 2021
作者:
Y
yangxiaolu3
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
feat: pullrefresh 更新
上级
142c7b22
变更
2
隐藏空白更改
内联
并排
Showing
2 changed file
with
64 addition
and
15 deletion
+64
-15
src/packages/pullrefresh/index.min.css
src/packages/pullrefresh/index.min.css
+0
-1
src/packages/pullrefresh/index.vue
src/packages/pullrefresh/index.vue
+64
-14
未找到文件。
src/packages/pullrefresh/index.min.css
已删除
100644 → 0
浏览文件 @
142c7b22
view
{
display
:
block
}
.nut-pullrefresh
{
position
:
relative
;
height
:
100%
}
.nut-pullrefresh
.pullrefresh-top
{
position
:
absolute
;
left
:
0
;
overflow
:
hidden
;
color
:
#969799
;
font-size
:
14px
;
line-height
:
50px
;
text-align
:
center
}
.nut-pullrefresh
.pullrefresh-top.pullrefresh-top-v
{
width
:
100%
;
height
:
50px
;
-webkit-transform
:
translateY
(
-100%
);
transform
:
translateY
(
-100%
)}
.nut-pullrefresh
.pullrefresh-top.pullrefresh-top-h
{
width
:
50px
;
height
:
100%
;
-webkit-transform
:
translateX
(
-100%
);
transform
:
translateX
(
-100%
);
writing-mode
:
tb-rl
}
.nut-pullrefresh
.pullrefresh-content
{
height
:
100%
;
overflow
:
auto
;
background
:
#fff
}
.nut-pullrefresh
.pullrefresh-bottom
{
position
:
absolute
;
overflow
:
hidden
;
color
:
#969799
;
font-size
:
14px
;
line-height
:
50px
;
text-align
:
center
}
.nut-pullrefresh
.pullrefresh-bottom.pullrefresh-bottom-v
{
left
:
0
;
bottom
:
0
;
width
:
100%
;
height
:
0px
;
-webkit-transform
:
translateY
(
100%
);
transform
:
translateY
(
100%
)}
.nut-pullrefresh
.pullrefresh-bottom.pullrefresh-bottom-h
{
top
:
0
;
right
:
0
;
width
:
50px
;
height
:
100%
;
-webkit-transform
:
translateX
(
100%
);
transform
:
translateX
(
100%
);
writing-mode
:
tb-rl
}
src/packages/pullrefresh/index.vue
浏览文件 @
30793656
...
...
@@ -13,18 +13,19 @@
direction == 'horizontal' ? 'pullrefresh-top-h' : 'pullrefresh-top-v'
"
>
<template
{{
refreshTem
}}
<!--
<template
v-if=
"status == 'loading' && (reachTop || reachLeft) && distance > 0"
>
{{
loadingText
}}
</
template
>
{{
loadingText
.
top
}}
</
template
>
<
template
v-if=
"status == 'pulling' && (reachTop || reachLeft) && distance > 0"
>
{{
pullingText
}}
</
template
>
{{
pullingText
.
top
}}
</
template
>
<
template
v-if=
"status == 'loosing' && (reachTop || reachLeft) && distance > 0"
>
{{
loosingText
}}
</
template
>
>
{{
loosingText
.
top
}}
</
template
>
-->
</view>
<view
class=
"pullrefresh-content"
ref=
"pull"
>
<slot></slot>
...
...
@@ -43,19 +44,19 @@
v-if=
"
status == 'loading' && (reachBottom || reachRight) && distance < 0
"
>
{{
loadingText
}}
</
template
>
{{
loadingText
.
bottom
}}
</
template
>
<
template
v-if=
"
status == 'pulling' && (reachBottom || reachRight) && distance < 0
"
>
{{
pullingText
}}
</
template
>
{{
pullingText
.
bottom
}}
</
template
>
<
template
v-if=
"
status == 'loosing' && (reachBottom || reachRight) && distance < 0
"
>
{{
loosingText
}}
</
template
>
{{
loosingText
.
bottom
}}
</
template
>
</view>
</view>
...
...
@@ -89,16 +90,31 @@ export default create({
},
pullingText
:
{
type
:
String
,
default
:
'
下拉刷新
'
type
:
Object
,
default
:
{
top
:
'
下拉刷新
'
,
bottom
:
'
上拉加载
'
,
left
:
'
左滑刷新
'
,
right
:
'
右滑加载
'
}
},
loosingText
:
{
type
:
String
,
default
:
'
松手释放刷新
'
type
:
Object
,
default
:
{
top
:
'
松手释放刷新
'
,
bottom
:
'
松手释放刷新
'
,
left
:
'
松手释放刷新
'
,
right
:
'
松手释放刷新
'
}
},
loadingText
:
{
type
:
String
,
default
:
'
加载中...
'
type
:
Object
,
default
:
{
top
:
'
加载中...
'
,
bottom
:
'
加载中...
'
,
left
:
'
加载中...
'
,
right
:
'
加载中...
'
}
}
},
components
:
{},
...
...
@@ -187,6 +203,39 @@ export default create({
return
style
;
});
const
refreshTem
=
computed
(()
=>
{
const
{
status
,
distance
}
=
state
;
/** 刷新 顶部或左侧 */
if
(
status
==
'
loading
'
&&
(
reachTop
.
value
||
reachLeft
.
value
)
&&
distance
>
0
)
{
return
props
.
loadingText
.
top
;
}
if
(
status
==
'
pulling
'
&&
(
reachTop
.
value
||
reachLeft
.
value
)
&&
distance
>
0
)
{
return
props
.
pullingText
.
top
;
}
if
(
status
==
'
loosing
'
&&
(
reachTop
.
value
||
reachLeft
.
value
)
&&
distance
>
0
)
{
return
props
.
loosingText
.
top
;
}
/** 刷新 底部或右侧 */
return
''
;
});
const
isTouchable
=
()
=>
state
.
status
!==
'
loading
'
&&
!
disabled
.
value
;
const
setStatus
=
(
distance
:
number
,
isLoading
?:
boolean
)
=>
{
...
...
@@ -353,6 +402,7 @@ export default create({
reachRight
,
reachLeft
,
getBottomStyle
,
refreshTem
,
...
toRefs
(
state
)
};
}
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录