From 61f585f9be4d5f2bb01f100d0002d2f6fae371d5 Mon Sep 17 00:00:00 2001
From: lin <1005713861@163.com>
Date: Fri, 17 Apr 2026 14:56:28 +0800
Subject: [PATCH] feat: 购有趣IOS提交
---
uni_modules/uni-popup/components/uni-popup/uni-popup.vue | 81 +++++++++++++++++++++++++++++++---------
1 files changed, 62 insertions(+), 19 deletions(-)
diff --git a/uni_modules/uni-popup/components/uni-popup/uni-popup.vue b/uni_modules/uni-popup/components/uni-popup/uni-popup.vue
index 2487d13..5af55e0 100644
--- a/uni_modules/uni-popup/components/uni-popup/uni-popup.vue
+++ b/uni_modules/uni-popup/components/uni-popup/uni-popup.vue
@@ -5,7 +5,7 @@
:duration="duration" :show="showTrans" @click="onTap" />
<uni-transition key="2" :mode-class="ani" name="content" :styles="transClass" :duration="duration"
:show="showTrans" @click="onTap">
- <view class="uni-popup__wrapper" :style="{ backgroundColor: bg }" :class="[popupstyle]" @click="clear">
+ <view class="uni-popup__wrapper" :style="getStyles" :class="[popupstyle]" @click="clear">
<slot />
</view>
</uni-transition>
@@ -39,6 +39,7 @@
* @property {Boolean} isMaskClick = [true|false] 蒙版点击是否关闭弹窗
* @property {String} backgroundColor 主窗口背景色
* @property {String} maskBackgroundColor 蒙版颜色
+ * @property {String} borderRadius 设置圆角(左上、右上、右下和左下) 示例:"10px 10px 10px 10px"
* @property {Boolean} safeArea 是否适配底部安全区
* @event {Function} change 打开关闭弹窗触发，e={show: false}
* @event {Function} maskClick 点击遮罩触发
@@ -86,6 +87,9 @@
type: String,
default: 'rgba(0, 0, 0, 0.4)'
},
+ borderRadius:{
+ type: String,
+ }
},
watch: {
@@ -157,16 +161,25 @@
backgroundColor: 'rgba(0, 0, 0, 0.4)'
},
transClass: {
+ backgroundColor: 'transparent',
+ borderRadius: this.borderRadius || "0",
position: 'fixed',
left: 0,
right: 0
},
maskShow: true,
mkclick: true,
- popupstyle: this.isDesktop ? 'fixforpc-top' : 'top'
+ popupstyle: 'top'
}
},
computed: {
+ getStyles() {
+ let res = { backgroundColor: this.bg };
+ if (this.borderRadius || "0") {
+ res = Object.assign(res, { borderRadius: this.borderRadius })
+ }
+ return res;
+ },
isDesktop() {
return this.popupWidth >= 500 && this.popupHeight >= 500
},
@@ -179,6 +192,17 @@
},
mounted() {
const fixSize = () => {
+ // #ifdef MP-WEIXIN
+ const {
+ windowWidth,
+ windowHeight,
+ windowTop,
+ safeArea,
+ screenHeight,
+ safeAreaInsets
+ } = uni.getWindowInfo()
+ // #endif
+ // #ifndef MP-WEIXIN
const {
windowWidth,
windowHeight,
@@ -187,6 +211,7 @@
screenHeight,
safeAreaInsets
} = uni.getSystemInfoSync()
+ // #endif
this.popupWidth = windowWidth
this.popupHeight = windowHeight + (windowTop || 0)
// TODO fix by mehaotian 是否适配底部安全区 ,目前微信ios 、和 app ios 计算有差异，需要框架修复
@@ -221,6 +246,12 @@
this.setH5Visible()
},
// #endif
+ activated() {
+ this.setH5Visible(!this.showPopup);
+ },
+ deactivated() {
+ this.setH5Visible(true);
+ },
created() {
// this.mkclick = this.isMaskClick || this.maskClick
if (this.isMaskClick === null && this.maskClick === null) {
@@ -240,10 +271,10 @@
this.maskClass.backgroundColor = this.maskBackgroundColor
},
methods: {
- setH5Visible() {
+ setH5Visible(visible = true) {
// #ifdef H5
// fix by mehaotian 处理 h5 滚动穿透的问题
- document.getElementsByTagName('body')[0].style.overflow = 'visible'
+ document.getElementsByTagName('body')[0].style.overflow = visible ? "visible" : "hidden";
// #endif
},
/**
@@ -323,13 +354,15 @@
position: 'fixed',
left: 0,
right: 0,
- backgroundColor: this.bg
+ backgroundColor: this.bg,
+ borderRadius:this.borderRadius || "0"
}
// TODO 兼容 type 属性 ，后续会废弃
if (type) return
this.showPopup = true
this.showTrans = true
this.$nextTick(() => {
+ this.showPoptrans()
if (this.messageChild && this.type === 'message') {
this.messageChild.timerClose()
}
@@ -346,22 +379,26 @@
left: 0,
right: 0,
bottom: 0,
- //paddingBottom: 'constant(safe-area-inset-bottom)', ///兼容 IOS<11.2/
- //paddingBottom: 'env(safe-area-inset-bottom)', ///兼容 IOS>11.2/
- //paddingBottom: this.safeAreaInsets + 'px',
- backgroundColor: this.bg
+ paddingBottom: this.safeAreaInsets + 'px',
+ backgroundColor: this.bg,
+ borderRadius:this.borderRadius || "0",
}
// TODO 兼容 type 属性 ，后续会废弃
if (type) return
- this.showPopup = true
- this.showTrans = true
+ this.showPoptrans()
},
/**
* 中间弹出样式处理
*/
center(type) {
this.popupstyle = 'center'
- this.ani = ['zoom-out', 'fade']
+ //微信小程序下，组合动画会出现文字向上闪动问题，再此做特殊处理
+ // #ifdef MP-WEIXIN
+ this.ani = ['fade']
+ // #endif
+ // #ifndef MP-WEIXIN
+ this.ani = ['zoom-out', 'fade']
+ // #endif
this.transClass = {
position: 'fixed',
/* #ifndef APP-NVUE */
@@ -373,12 +410,12 @@
right: 0,
top: 0,
justifyContent: 'center',
- alignItems: 'center'
+ alignItems: 'center',
+ borderRadius:this.borderRadius || "0"
}
// TODO 兼容 type 属性 ，后续会废弃
if (type) return
- this.showPopup = true
- this.showTrans = true
+ this.showPoptrans()
},
left(type) {
this.popupstyle = 'left'
@@ -389,6 +426,7 @@
bottom: 0,
top: 0,
backgroundColor: this.bg,
+ borderRadius:this.borderRadius || "0",
/* #ifndef APP-NVUE */
display: 'flex',
flexDirection: 'column'
@@ -396,8 +434,7 @@
}
// TODO 兼容 type 属性 ，后续会废弃
if (type) return
- this.showPopup = true
- this.showTrans = true
+ this.showPoptrans()
},
right(type) {
this.popupstyle = 'right'
@@ -408,6 +445,7 @@
right: 0,
top: 0,
backgroundColor: this.bg,
+ borderRadius:this.borderRadius || "0",
/* #ifndef APP-NVUE */
display: 'flex',
flexDirection: 'column'
@@ -415,8 +453,13 @@
}
// TODO 兼容 type 属性 ，后续会废弃
if (type) return
- this.showPopup = true
- this.showTrans = true
+ this.showPoptrans()
+ },
+ showPoptrans(){
+ this.$nextTick(()=>{
+ this.showPopup = true
+ this.showTrans = true
+ })
}
}
}
--
Gitblit v1.9.3