苹果小程序 uni-popup 弹出层显示底部弹框会有镂空

weixin_57653786

已于 2023-08-11 11:56:20 修改

阅读量1.6k

点赞数 1

文章标签：小程序

于 2023-08-06 21:59:49 首次发布

本文链接：https://blog.csdn.net/weixin_57653786/article/details/132136319

版权

<scroll-view scroll-y="true" :safe-area='false'>
<view></view>

</scroll-view>

在其添加:safe-area='false',可以解决这一问题

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

weixin_57653786

关注关注

1
点赞
踩
2

收藏

觉得还不错? 一键收藏
1
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

uniapp中Popup弹出层底部空隙问题（手把手图解）

m0_55258023的博客

08-15

6423

uniapp中Popup弹出层底部空隙问题（手把手图解）

【uniapp2.0】解决真机测试底部有空白问题

栀妹儿的炼丹炉

07-25

3005

根因：这种情况一般是在小程序中为了隐藏tabbar调用的，但是有些页面并没有tabbar展示，而此时调用该function会fail，如果没有fail函数，会直接抛出报错。我的问题是：我的空白区域和内部导航栏一样高，原来是因为没改导航默认参数↓。现在这个白色部分被叫做“安全区域”（好像开发故意放的）登录页写的时候没注意看pages.json的参数，现在app在iPhone上的空白解决了！写明：custom 是隐藏导航栏。

1 条评论您还未登录，请先登录后发表或查看评论

uniapp中Popup弹出层底部空隙问题（ios手机）

baidu_38492843的博客

11-12

206

给uni-popup标签加 :safe-area='false' 属性。

如何使用uni-popup以及取消uni-popup的底部安全距离

最新发布

m0_68767282的博客

12-19

347

给uni-popup组件取一个ref名称welfarePopup。如图所示，就是直接使用uni-popup会有一个底部安全距离。如果 ::v-deep没有用的话可以去试试其他的方式。uni-popup有一个配置默认是true。"app-plus"里要先加上这段代码。/deep/、:deep等之类的。打开弹窗和关闭弹窗都要使用到。使用深度选择器来修改组件样式。

uni-app页面下方空白解决方案

qq_43644046的博客

03-09

5400

uniapp开发app时候，出现了空白，即使html,body设置100%也没用，情况如图下方空白之跟随着详情介绍的内容自由变化背景色于是我把详情介绍这个<view>添加了class，设置了padding-buttom:150rpx,大家可以适量取值于是也算成功但是这也有弊端，因为详情介绍长短不一，设置过小会出现空白，如果设置过长，会导致页面下面多了有背景色的空缺。这是比较简单的方式，还有个比较好的思路，判断一下界面长度，如果超出界面就设置100%，如果没有超出，

关于uniapp小程序在苹果手机会出现的问题

shika233的博客

02-25

3587

笔记 1、uni-app 底部安全距离问题参考uni-app底部安全距离遮挡以及底部tabbar距离 // ios底部安全距离-padding .savepadding{ padding-bottom: constant(safe-area-inset-bottom); padding-bottom: env(safe-area-inset-bottom); box-sizing: content-box; } // ios底部安全距离-bottom .savebottom

uniapp底部弹出层(uni-popup)使用技巧

m0_63553261的博客

03-01

5103

uniapp底部弹出层(uni-popup)使用技巧

uniapp uni-popup弹出层组件弹窗无法弹出自定义样式问题

jiey0407的博客

02-23

1339

uni-popup弹出层组件之前用到弹出层组件时发现弹出时会有一层灰色的遮罩，后来调试了几次发现是因为没有自定义给弹出层宽高，尝试了几次终于做到自己想要的效果，话不多说，直接附上完整代码：效果图： <template> <view> <view class="sign_text" @tap="toggle('center')"> <text style="line-height: 60px;margin-top: 12px;">点击弹出&lt

uni-app自定义uni-popup弹窗内容

03-22

自定义uni-popup内容，包含picker-view组件，前提基础需要运行在uni-app项目之下，且已保证插入外置组件，根据传入的list数据渲染选择列表，且能回填数据组件调用<SelectPick v-if="showPick" v-model="pickValue...

前端开发工作中可能会遇到的问题及解决方法

Bonsoir777的博客

09-14

3205

本文主要分享前端开发工作中可能会遇到的问题及解决方法

uniapp进阶uniPay微信小程序商城uniCloud云开发APP

06-30

课程亮点：纯前端实现H5、小程序、APP商城开发；技术栈：uniapp+uniCloud+unipay+uni-ui+uView+vuex；学完可开发定制化商城，web前端技术再进阶一大步；知识模块：1.uniapp+unicloud云开发2.uniapp常用组件库及官方扩展UI库3.uView第三方UI组件库4.unicloud云开发实践，管理校验token权限5.vuex状态管理module模块商业级使用6.uni-id微信一键登录及手机验证码登录7.开通微信支付及支付宝支付的全流程操作，unipay的实战

iOS-Popup-Style-Menu-Buttons:弹出式菜单按钮

07-11

弹出式菜单按钮附带的项目仅展示了如何创建带有按钮的 Google 样式（如 Google Inbox App）弹出式菜单。您需要做的就是下载项目并运行它以查看它是如何工作的。概述在这个例子中，主视图控制器上放置了 3 个按钮。已添加约束以支持所有 iPhone 分辨率。使用 UIView 动画，在单击主按钮时，我们将其他按钮上移以将它们放置在主按钮上方。此外，我们旋转主按钮（它是一个 + 图标）使其看起来像一个 x 图标（关闭）。截图默认状态：菜单打开状态：

微信小程序开发uni-popup弹出层触摸穿透问题解决

chenzhezhong的博客

11-16

1422

解决小程序uni-popup弹出层触摸穿透问题

关于微信小程序中，解决有tabbar时，键盘弹起引起的空白区域问题

weixin_43972213的博客

09-20

2152

图1 出现空白区域图2 样式未上移图3 正确版

【bug】vuxUI组件popup弹出框在IOS中遮罩层会遮住页面

kakaxiD的博客

04-23

702

可以增加自定义方法v-transfer-dom。

uniApp注意事项/坑 --- 第二期

a3356418578的博客

02-01

1374

uniApp踩过的坑，希望你们可以少踩一点哈哈哈 =。=

vux popup组件在ios上遮罩层挡住了弹窗

qq_39471778的博客

04-17

1476

vux popup组件在ios上遮罩层挡住了弹窗移动端在使用vux框架中popup组件时，安卓上正常，ios上遮罩层挡住弹窗，这是因为滚动元素和mask遮罩层在同一级，vux框架默认把遮罩层放在body标签下，有些人说更改源码，但是改了源码从新打包时会npm所有依赖，所以生产环境不会生效解决办法引入把popup放在这个指令里面 ...

uniapp u-popup封装弹框背景滚动/滚动穿模

weixin_45811884的博客

06-19

528

【代码】uniapp u-popup封装弹框背景滚动/滚动穿模。

uniapp微信小程序在ios端返回不显示弹窗的bug解决

lyz246859的博客

05-24

528

其实就是返回页面的弹窗加个延迟就好啦。

uni-popup 弹出层 uni_modules 安装

06-08

要在 uni-popup 中使用 uni_modules，需要先进行安装。以下是安装步骤： 1. 打开 HBuilderX，在项目根目录的 manifest.json 文件中添加以下代码： ```json { "uni_modules": { "path": "uni_modules" } } ``` 2. 在命令行中进入项目根目录，执行以下命令进行安装： ```bash npm install ``` 3. 在需要使用 uni-popup 的页面中，引入 uni-popup 组件： ```html <template> <view> <uni-popup></uni-popup> </view> </template> <script> import UniPopup from '@/uni_modules/uni-popup/components/uni-popup/uni-popup.vue' export default { components: { UniPopup } } </script> ``` 这样就可以在页面中使用 uni-popup 弹出层组件，并且可以使用 uni_modules 中的其他组件了。