Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
Velpro187
uni-app
提交
c41fc28f
U
uni-app
项目概览
Velpro187
/
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,发现更多精彩内容 >>
提交
c41fc28f
编写于
11月 14, 2018
作者:
X
xiaoyucoding
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
fix: 修复 popup 组件 top 值不正确的问题;修复 popup 底部示例参数不正确的问题。
上级
6340c16e
变更
2
隐藏空白更改
内联
并排
Showing
2 changed file
with
92 addition
and
82 deletion
+92
-82
examples/hello-uniapp/components/uni-popup.vue
examples/hello-uniapp/components/uni-popup.vue
+73
-63
examples/hello-uniapp/pages/template/popup/popup.vue
examples/hello-uniapp/pages/template/popup/popup.vue
+19
-19
未找到文件。
examples/hello-uniapp/components/uni-popup.vue
浏览文件 @
c41fc28f
<
template
>
<view>
<view
class=
"uni-mask"
v-show=
"show"
:style=
"
{top:
titleHeight
}" @click="hide">
</view>
<view
class=
"uni-mask"
v-show=
"show"
:style=
"
{top:
offsetTop + 'px'
}" @click="hide">
</view>
<view
:class=
"['uni-popup','uni-popup-'+type]"
v-show=
"show"
>
{{
msg
}}
<slot></slot>
...
...
@@ -9,75 +9,85 @@
</
template
>
<
script
>
export
default
{
props
:
{
show
:
{
type
:
Boolean
,
default
:
false
export
default
{
props
:
{
show
:
{
type
:
Boolean
,
default
:
false
},
type
:
{
type
:
String
,
//top - 顶部, middle - 居中, bottom - 底部
default
:
'
middle
'
},
msg
:
{
type
:
String
,
default
:
""
}
},
type
:
{
type
:
String
,
//top - 顶部, middle - 居中, bottom - 底部
default
:
'
middle
'
data
()
{
let
offsetTop
=
0
;
//#ifdef H5
offsetTop
=
44
;
//#endif
return
{
offsetTop
:
offsetTop
}
},
msg
:{
type
:
String
,
default
:
""
}
},
methods
:{
hide
:
function
(){
this
.
$emit
(
'
hidePopup
'
);
methods
:
{
hide
:
function
()
{
this
.
$emit
(
'
hidePopup
'
);
}
}
}
}
</
script
>
<
style
>
.uni-mask
{
position
:
fixed
;
z-index
:
998
;
top
:
0
;
right
:
0
;
bottom
:
0
;
left
:
0
;
background-color
:
rgba
(
0
,
0
,
0
,
.3
);
}
.uni-mask
{
position
:
fixed
;
z-index
:
998
;
top
:
0
;
right
:
0
;
bottom
:
0
;
left
:
0
;
background-color
:
rgba
(
0
,
0
,
0
,
.3
);
}
.uni-popup
{
position
:
absolute
;
z-index
:
999
;
background-color
:
#ffffff
;
box-shadow
:
0
0
30
upx
rgba
(
0
,
0
,
0
,
.1
);
}
.uni-popup
{
position
:
absolute
;
z-index
:
999
;
background-color
:
#ffffff
;
box-shadow
:
0
0
30
upx
rgba
(
0
,
0
,
0
,
.1
);
}
.uni-popup-middle
{
display
:
flex
;
flex-direction
:
column
;
align-items
:
center
;
width
:
380
upx
;
height
:
380
upx
;
border-radius
:
10
upx
;
top
:
50%
;
left
:
50%
;
transform
:
translate
(
-50%
,
-50%
);
justify-content
:
center
;
padding
:
30
upx
;
}
.uni-popup-middle
{
display
:
flex
;
flex-direction
:
column
;
align-items
:
center
;
width
:
380
upx
;
height
:
380
upx
;
border-radius
:
10
upx
;
top
:
50%
;
left
:
50%
;
transform
:
translate
(
-50%
,
-50%
);
justify-content
:
center
;
padding
:
30
upx
;
}
.uni-popup-top
{
top
:
0
;
left
:
0
;
width
:
100%
;
height
:
100
upx
;
line-height
:
100
upx
;
text-align
:
center
;
}
.uni-popup-bottom
{
left
:
0
;
bottom
:
0
;
width
:
100%
;
height
:
100
upx
;
line-height
:
100
upx
;
text-align
:
center
;
}
.uni-popup-top
{
top
:
0
;
left
:
0
;
width
:
100%
;
height
:
100
upx
;
line-height
:
100
upx
;
text-align
:
center
;
}
.uni-popup-bottom
{
left
:
0
;
bottom
:
0
;
width
:
100%
;
height
:
100
upx
;
line-height
:
100
upx
;
text-align
:
center
;
}
</
style
>
examples/hello-uniapp/pages/template/popup/popup.vue
浏览文件 @
c41fc28f
...
...
@@ -27,51 +27,51 @@
</view>
</
template
>
<
script
>
import
uniPopup
from
"
../../../components/uni-popup.vue
"
;
import
uniPopup
from
'
../../../components/uni-popup.vue
'
;
export
default
{
data
()
{
return
{
popType
:
'
middle
'
,
title
:
"
popup
"
,
showPopupMiddle
:
false
,
showPopupTop
:
false
,
showPopupBottom
:
false
,
msg
:
""
popType
:
'
middle
'
,
title
:
'
popup
'
,
showPopupMiddle
:
false
,
showPopupTop
:
false
,
showPopupBottom
:
false
,
msg
:
''
}
},
methods
:
{
//统一的关闭popup方法
hidePopup
:
function
()
{
hidePopup
:
function
()
{
this
.
showPopupMiddle
=
false
;
this
.
showPopupTop
=
false
;
this
.
showPopupTop
=
false
;
this
.
showPopupBottom
=
false
;
},
//展示居中 popup
showMiddlePopup
:
function
()
{
showMiddlePopup
:
function
()
{
this
.
hidePopup
();
this
.
popType
=
"
middle
"
;
this
.
popType
=
'
middle
'
;
this
.
showPopupMiddle
=
true
;
},
//展示顶部 popup
showTopPopup
:
function
(){
showTopPopup
:
function
()
{
this
.
hidePopup
();
this
.
popType
=
'
top
'
;
this
.
msg
=
"
顶部 popup 信息内容
"
;
this
.
msg
=
'
顶部 popup 信息内容
'
;
this
.
showPopupTop
=
true
;
},
//展示底部 popup
showBottomPopup
:
function
(){
showBottomPopup
:
function
()
{
this
.
hidePopup
();
this
.
popType
=
'
top
'
;
this
.
msg
=
"
底部 popup 信息内容
"
;
this
.
popType
=
'
bottom
'
;
this
.
msg
=
'
底部 popup 信息内容
'
;
this
.
showPopupBottom
=
true
;
}
},
components
:{
components
:
{
uniPopup
}
}
</
script
>
<
style
>
</
style
>
\ No newline at end of file
</
style
>
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录