Skip to content

Commit 3dcec9f

Browse files
committed
fix: 修复toast组件在隐藏并降低zIndex过程中会出现被高zIndex组件遮挡的bug
1.从样式中删除了原本show状态添加的固定zIndex(好像代码冗余了) 2.添加css样式事件穿透,防止组件隐藏的时候zIndex过高导致点击事件被遮挡 3.切换组件状态时动态切换padding样式,在hide状态时组件的宽度突然缩小造成视觉效果不适
1 parent 8cf223d commit 3dcec9f

File tree

1 file changed

+3
-3
lines changed

1 file changed

+3
-3
lines changed

uview-ui/components/u-toast/u-toast.vue

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
<template>
22
<view class="u-toast" :class="[isShow ? 'u-show' : '', 'u-type-' + config.type, 'u-position-' + config.position]" :style="{
3-
padding: isShow ? '0 40rpx' : 0,
43
zIndex: uZIndex
54
}">
65
<view class="u-icon-wrap">
@@ -54,7 +53,7 @@
5453
},
5554
uZIndex() {
5655
// 显示toast时候,如果用户有传递z-index值,有限使用
57-
return this.isShow ? (this.zIndex ? this.zIndex : this.$u.zIndex.toast) : '-1';
56+
return this.isShow ? (this.zIndex ? this.zIndex : this.$u.zIndex.toast) : '999999';
5857
}
5958
},
6059
methods: {
@@ -136,11 +135,12 @@
136135
justify-content: center;
137136
font-size: 28rpx;
138137
opacity: 0;
138+
pointer-events: none;
139+
padding:0 40rpx;
139140
}
140141
141142
.u-toast.u-show {
142143
opacity: 1;
143-
z-index: 9999999;
144144
}
145145
146146
.u-text {

0 commit comments

Comments
 (0)