有了域名和空间怎么做网站下载优化大师安装桌面

 问题：

uniapp项目打包的微信小程序，设置uni-popup type="bottom"时，底部有空隙

解决思路：

1、检查代码是否存在样式问题

2、使用微信小程序自带的调试器元素

3、查看源码定位底部是如何出现该空隙的

1、检查代码

检查多次代码，都是正常没有问题，样式设置也没有问题，在H5环境展示没有问题，只存在与微信小程序真机环境

<uni-popup ref="shareUniPopup" :animation="true" type="bottom" @maskClick="maskClickpopup()" @change="changePopup()" :maskBackgroundColor="'rgba(0, 0, 0, 0.7)'"><view class="sharePopupClass"><view class="morePopupTitleClass"><view class="shareTitleClass">已选{{selectedIdDataList.length}}张图片</view><image src="/static/images/close.png" style="width: 36rpx;height: 36rpx;margin-right: 34rpx;" @click="closeSharePopupClick"></image></view><view style="height: 2rpx;width: 100%;background-color: #CDCDCD;"></view><view class="uni-margin-wrap"><swiper class="swiper"><swiper-item><view class="swiper-item uni-bg-red">A</view></swiper-item><swiper-item><view class="swiper-item uni-bg-green">B</view></swiper-item><swiper-item><view class="swiper-item uni-bg-blue">C</view></swiper-item></swiper></view></view></uni-popup>

排除自己写的代码的问题

2、使用微信小程序自带的调试器元素

调试也没有看到有空隙位置的设置高度，只能去看uni-popup的源码了

3、查看源码定位底部是如何出现该空隙的

this.safeAreaInsets

unia-popup中的源码中有PopUp 弹出层 bottom 底部弹出，全局查找bottom

/*** PopUp 弹出层* @description 弹出层组件，为了解决遮罩弹层的问题* @tutorial https://ext.dcloud.net.cn/plugin?id=329* @property {String} type = [top|center|bottom|left|right|message|dialog|share] 弹出方式* 	@value top 顶部弹出* 	@value center 中间弹出* 	@value bottom 底部弹出* 	@value left		左侧弹出* 	@value right  右侧弹出* 	@value message 消息提示* 	@value dialog 对话框* 	@value share 底部分享示例* @property {Boolean} animation = [true|false] 是否开启动画* @property {Boolean} maskClick = [true|false] 蒙版点击是否关闭弹窗(废弃)* @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 点击遮罩触发*/

根据bottom字段全局查找到了：底部弹出样式处理

/*** 底部弹出样式处理*/bottom(type) {this.popupstyle = 'bottom'this.ani = ['slide-bottom']this.transClass = {position: 'fixed',left: 0,right: 0,bottom: 0,paddingBottom: this.safeAreaInsets + 'px',backgroundColor: this.bg,borderRadius:this.borderRadius || "0",}// TODO 兼容 type 属性 ，后续会废弃if (type) returnthis.showPoptrans()},

看代码中有一个paddingBottom 设置，有一个 this.safeAreaInsets + 'px'，

尝试直接设置 paddingBottom： 0后，重新测试即可解决了。

解决后效果图：