blackteay/vant-weapp
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant-weapp.git synced 2025-04-06 03:58:05 +08:00
Code Issues Projects Releases Wiki Activity

[improvement] Toast: add z-index prop (#571)

Browse Source
This commit is contained in:
neverland 2018-09-13 19:19:34 +08:00 committed by GitHub
parent 1a3d6ff404
commit 83da58e030
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
9 changed files with 16 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
dist/toast/index.js vendored
View File

@ -6,6 +6,10 @@ create({
mask: Boolean,
message: String,
forbidClick: Boolean,
zIndex: {
type: Number,
value: 1000
},
type: {
type: String,
value: 'text'

3
dist/toast/index.wxml vendored
View File

@ -1,10 +1,11 @@
<van-overlay
show="{{ show && (mask || forbidClick) }}"
mask="{{ mask }}"
z-index="3000"
z-index="{{ zIndex }}"
/>
<van-transition
show="{{ show }}"
custom-style="z-index: {{ zIndex }}"
custom-class="van-toast__container"
>
<view class="van-toast van-toast--{{ type === 'text' ? 'text' : 'icon' }} van-toast--{{ position }}">

2
dist/toast/index.wxss vendored
View File

@ -1 +1 @@
.van-toast{display:-webkit-box;display:-webkit-flex;display:flex;color:#fff;font-size:12px;line-height:1.2;border-radius:5px;word-break:break-all;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;flex-direction:column;box-sizing:border-box;background-color:rgba(0,0,0,.7)}.van-toast__container{top:50%;left:50%;z-index:3001;position:fixed;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.van-toast--text{padding:12px;min-width:220px}.van-toast--icon{width:120px;min-height:120px;padding:15px}.van-toast--icon .van-toast__icon{height:1em;font-size:50px}.van-toast--icon .van-toast__text{font-size:14px;padding-top:10px}.van-toast__loading{margin:10px 0 5px}.van-toast--top{-webkit-transform:translate(0,-30vh);transform:translate(0,-30vh)}.van-toast--bottom{-webkit-transform:translate(0,30vh);transform:translate(0,30vh)}
.van-toast{display:-webkit-box;display:-webkit-flex;display:flex;color:#fff;font-size:12px;line-height:1.2;border-radius:5px;word-break:break-all;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;flex-direction:column;box-sizing:border-box;background-color:rgba(0,0,0,.7)}.van-toast__container{top:50%;left:50%;position:fixed;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.van-toast--text{padding:12px;min-width:220px}.van-toast--icon{width:120px;min-height:120px;padding:15px}.van-toast--icon .van-toast__icon{height:1em;font-size:50px}.van-toast--icon .van-toast__text{font-size:14px;padding-top:10px}.van-toast__loading{margin:10px 0 5px}.van-toast--top{-webkit-transform:translate(0,-30vh);transform:translate(0,-30vh)}.van-toast--bottom{-webkit-transform:translate(0,30vh);transform:translate(0,30vh)}

1
dist/toast/toast.js vendored
View File

@ -5,6 +5,7 @@ const defaultOptions = {
mask: false,
message: '',
show: true,
zIndex: 1000,
duration: 3000,
position: 'middle',
forbidClick: false,

1
packages/toast/README.md
View File

@ -92,5 +92,6 @@ const timer = setInterval(() => {
| mask | 是否显示背景蒙层 | `Boolean` | `false` |
| forbidClick | 是否禁止背景点击 | `Boolean` | `false` |
| loadingType | 加载图标类型, 可选值为 `spinner` | `String` | `circular` |
| zIndex | z-index 层级 | `Number` | `1000` |
| duration | 展示时长(ms)，值为 0 时，toast 不会消失 | `Number` | `3000` |
| selector | 自定义选择器 | `String` | `van-toast` |

4
packages/toast/index.js
View File

@ -6,6 +6,10 @@ create({
mask: Boolean,
message: String,
forbidClick: Boolean,
zIndex: {
type: Number,
value: 1000
},
type: {
type: String,
value: 'text'

1
packages/toast/index.pcss
View File

@ -16,7 +16,6 @@
&__container {
top: 50%;
left: 50%;
z-index: 3001;
position: fixed;
transform: translate(-50%, -50%);
}

3
packages/toast/index.wxml
View File

@ -1,10 +1,11 @@
<van-overlay
show="{{ show && (mask || forbidClick) }}"
mask="{{ mask }}"
z-index="3000"
z-index="{{ zIndex }}"
/>
<van-transition
show="{{ show }}"
custom-style="z-index: {{ zIndex }}"
custom-class="van-toast__container"
>
<view class="van-toast van-toast--{{ type === 'text' ? 'text' : 'icon' }} van-toast--{{ position }}">

1
packages/toast/toast.js
View File

@ -5,6 +5,7 @@ const defaultOptions = {
mask: false,
message: '',
show: true,
zIndex: 1000,
duration: 3000,
position: 'middle',
forbidClick: false,