目录

Uni Popup组件底部安全区域问题

andy90s 收录于类别前端

2023-05-18 2024-07-26 约 174 字预计阅读 1 分钟

目录

官方自带了一个popup组件，但是在ios手机上，如果popup组件带圆角，会出现底部安全区域问题，如下图所示：

底部安全区域问题

底部安全区域问题

2 解决方案 `:safeArea=false`

js

<uni-popup type="bottom" :safeArea=false>
    <view class="content">
        <view>标题</view>
        <view>内容</view>
    </view>
</uni-popup>

.content {
    background-color: #fff;
    border-radius: 20upx 20upx 0 0;
    /*兼容 IOS<11.2*/
		padding-bottom: constant(safe-area-inset-bottom);
		/*兼容 IOS>11.2*/
		padding-bottom: env(safe-area-inset-bottom);
}

相关内容