微信小程序 i-drawer ios输入框未隐藏

最新推荐文章于 2024-04-24 15:42:18 发布
最新推荐文章于 2024-04-24 15:42:18 发布
阅读量453 收藏
点赞数 1
分类专栏： 小程序 文章标签： 小程序 ios
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/guoqing2016/article/details/106780662
版权

在ios的手机上发现一个很奇妙的bug，请看下图
ios
在页面的空白处有几个输入框。emmmmmm
这个是因为在此界面中有对应的弹框，然后不知道为什么ios的手机，输入框并没有隐藏掉，反而只显示输入框，但是弹框的确是隐藏的状态
（弹框我是用的iview里的i-drawer组件）
ios
弹框唤醒后，可以看到，真的就是弹框里面的输入框，初始化的时候没有跟着弹框的状态去隐藏，emmmmmmmmmm

具体的解决方法就是，对每个输入框标签都加上hidden属性，对应上弹框的显示隐藏状态，然后就不会出现了

这就是小程序吗，爱了爱了~

guoqing2016
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
iview学习帮助文档
weixin_40885337的博客
03-25 3027
安装iview npm install view-design --save 导入iview 在main.js中导入iview import ViewUI from 'view-design'; import 'view-design/dist/styles/iview.css'; Vue.use(ViewUI); 按需引用iview组件 a.安装babel npm install babel-plugin-import --save-dev b.在 .babelrc 文件中 { "plugins
微信小程序-小程序模仿QQ6.0侧滑菜单
08-06
wx-drawer 小程序模仿QQ6.0侧滑菜单 wx-drawer
微信小程序iOS使用input输入时placeholder及输入内容消失或隐藏
weixin_43629308的博客
01-10 8163
在微信小程序开发中遇到一个小bug，在页面有一个输入框，进入页面后点击input获取焦点调起键盘，这时候iPhone出现placeholder消失、输入框内没有光标，输入打字的时候也没有输入显示的内容，当隐藏键盘后，输入框内显示正常 使用安卓机和IOS工具测试都是正常的，但是真机测试安卓正常IOD异常，猜测可能是iOS或者微信小程序自身的bug。 解决方式，给加一个边距，padding或marg...
mpvue小程序中使用i-drawer组件
前端-尔嵘
03-23 401
小程序具有简洁轻便，无需安装，打开即用的特点；遇到页面查询添加过多而感觉页面混乱，特使用iview-weapph中的i-drawer组件进行重构，既节省了空间又显得页面有条理。实现了如下的完整功能： 1.组件配置和引用： (1).将iview-weapp的dist文件内容拷贝到static文件夹下的iview备用。文件如下: (2).进入pages.json文件中（用来配置页面的路由已经引用UI组件等）,pages.json格式如下: (3).找到你需要引用组件的页面,本地引入iview-w
mpvue中使用iview-weapp中的i-drawer和i-icon
前端-尔嵘
03-26 397
一、 源码中的i-drawer隐藏区域的内容是位于中间的，发现无论是怎样修改样式都无法改变内容的位置，我们希望内容出现在顶部，那么需要修改iview中drawer源码中的后缀名为wxss的文件，源码修改如下： .i-drawer-left .i-drawer-container { left: 0; top: 12%; /* top: 50%; */ transform: translate3d(-100%, -50%, 0) } 源码的样式优先级最高，只能改，后需要如果在需要引入组件也是这
微信小程序实现炫酷的弹出式菜单特效
12-11
今天给大家带来一个微信小程序的弹出是菜单效果，老规矩先上效果图。(录制的gif动画有点卡，实际真机或是模拟器上很顺畅) 先简单说下思路： 1、首先在屏幕的某个位置放几个悬浮按钮，放几个看你需要的功能 2、点击...
微信小程序实战之自定义抽屉菜单（7）
12-29
微信提供了动画api，就是下面这个 相关链接：https://mp.weixin.qq.com/debug/wxadoc/dev/api/api-animation.html#wxcreateanimationobject 通过使用这个创建动画的api，可以做出很多特效出来 下面介绍一个抽屉...
微信小程序表单弹窗实例
01-03
开发中有时候会碰到需要一个表单弹窗来处理数据的提交处理，...<view class=drawer_screen bindtap=powerDrawer data-statu=close wx:if={{showModalStatus}}> <!--content--> <!--使用animation属性指定需
微信小程序实现弹框效果
12-28
本文实例为大家分享了微信小程序实现弹框效果的具体代码，供大家参考，具体内容如下 先上代码 wxml部分： <view class='top' bindtap='powerDrawer' data-statu=open data-num='300'> 向上弹起 ...
基于C#的有关Z顺序的窗体仿抽屉式小程序 Drawer
04-25
这是一个基于C#的有关Z顺序的窗体仿抽屉式小程序 Drawer
巧妙运用iView Weapp------------小程序更得心应手 （tab nav）
若如流水 淡淡流过
09-12 7867
最近几个月小生一直在学习vue.js，也分享了许多vue常用列子，每个列子都是小生自己在项目中积累下来的，经过测试无bug后修改成列子与走在前端路上的朋友一同进步。接下来小生将围绕小程序来写列子，谁叫2018年小程序火的如日中天呢。 demo地址：https://download.csdn.net/download/zxd1314520/10665012 这一篇将围绕小程序的条件渲染来写： ...
vue+iview+drawer , vue抽屉效果
热门推荐
浩星
10-07 1万+
前言： iview+抽屉效果，通过class来控制内容需要展示的内容 效果展示图： 第一：封装的组件cdrawer.vue <template> <Drawer v-model="drawerVal" :class-name='className' :mask='mask' :...
mpvue中引入iview weapp标签使用方法(二)
好气嗷，但仍要保持微笑!
02-20 1118
在组件的main.json中引入最为重要 （一）抽屉-----(i-drawer) &lt;i-button @click="toggleLeft1" type="ghost"&gt;左边弹出1&lt;/i-button&gt; &lt;i-drawer mode="left" :visible="showLeft1" @close="toggleLeft1"
iOS微信小程序键盘弹出时输入框被挡住
Lyran的博客
02-13 2671
底部输入框采用fixed定位后，在iPhone13这种有底部安全区的手机上，键盘弹出时被遮挡，在安卓机上是正常的。
小程序ios软键盘弹起挡住input输入框
weixin_46481295的博客
03-16 1998
ios在小程序上弹起键盘挡住了输入框 要求我在点开页面的时候自动弹起键盘，我使用了input组件内的cursor-spacing属性，但是发现在ios上会出现错位的bug，后面我就使用了onKeyboardHeightChange这个方法，微信原生的应该也一样可以使用的 在input的父组件上给一个相对定位或者fixed定位，动态的去赋值bottom内的值，ios需要-1px，注意：在input输入框内要加上:adjust-position="false"键盘弹起时，是否自动上推页面，这样就能解决这...
小程序 ios设备input输入框问题
weixin_47561793的博客
12-22 1668
小程序虽然支持数据双向绑定 像这样 最近在改小程序的BUG时候发现 双向绑定在ios部分机型真机调试下输入过快或者删除过快会出现BUG，只能慢慢一个个输入，输入过快会覆盖。 建议大家放弃双向绑定改写成这样 实现的效果是一样的，BUG也被解决了 ~~~~~~~~特此记录 ...
抖音 小程序 获取手机号 报错 getPhoneNumber:fail auth deny
最新发布
fuchto的博客
04-24 387
这是因为 当前小程序没有获取 手机号的 权限。后可用，默认获取权限，无需申请；此能力仅支持小程序通过。
陪诊小程序的市场潜力与发展趋势研究
2402_83689311的博客
04-24 275
随着社会的快速发展和人口老龄化的加剧，医疗服务需求日益增长，而陪诊服务作为医疗服务的重要补充，正逐渐受到人们的关注和青睐。陪诊小程序利用互联网技术，将陪诊服务与用户需求紧密连接，提高了服务的便捷性和效率。他们往往需要更加细致的照顾和陪伴，而陪诊小程序能够提供专业的陪诊服务，满足老年人的需求。随着技术的不断创新和市场的不断拓展，陪诊小程序将在未来医疗服务领域发挥更加重要的作用，为人们的生活带来更多便利和舒适。通过拓展海外市场，引入国际先进的陪诊服务理念和模式，提升陪诊小程序的国际竞争力。
用el-tree控制多个el-drawer的显示隐藏
04-25
好的，这是一个常见的需求，您需要在el-tree的节点上添加一个事件，绑定一个方法，在这个方法里面可以动态控制多个el-drawer的显示与隐藏。代码示例如下： ```html <el-tree :data="data" @node-click=...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值