lin
2026-04-17 8eb6cb869fb69888abc8f99d3b1fad4fbddcdace
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
            })
         }
      }
   }