关于image图片设置宽度百分比之后在苹果端最新的系统会失效，安卓和ios老版本系统没问题

<template>
<view class="popup-img">
<u-popup v-model="isShow" mode="center">
<view class="redev-mask" @click="close">
<view class="mask-box">
<image mode="widthFix" @click.stop v-if="imgUrl" :src="imgUrl"></image>
<u-icon class="close-circle" name="close-circle"></u-icon>
</view>
</view>
</u-popup>
</view>
</template>

<script>
export default {
data() {
return {

        }  
    },  
    props: {  
        isShow: {  
            type: Boolean,  
            default: false  
        },  
        imgUrl: {  
            type: String,  
            default: ''  
        }  
    },  
    methods: {  
        close() {  
            this.$emit('update:isShow', false);  
            this.$emit('close');  
        }  
    }  
}  

</script>

<style lang="scss" scoped>
.redev-mask {
// background: rgba(0, 0, 0, 0.8);
position: fixed;
width: 100%;
height: calc(100%);
left: 0;
top: 0;
bottom: var(--window-bottom);
z-index: 99999;

    .mask-box {  
        position: relative;  
        position: absolute;  
        left: 50%;  
        top: 50%;  
        width: 98%;  
        transform: translateY(-50%) translateX(-50%);  

        uni-image,  
        .image,  
        image,  
        img {  
            width: 75%;  
            width: 75vw;  
            border-radius: 20rpx;  
            display: block;  
            margin: 0 auto;  
        }  

        .close-circle {  
            font-size: 60rpx;  
            color: #fff;  
            font-weight: normal;  
            position: absolute;  
            bottom: -120rpx;  
            right: 50%;  
            transform: translateX(50%);  
        }  
    }  
}  

</style>

各位大神帮忙看下到底是啥问题