当前位置: 首页> 科技> 互联网 > uniapp使用 input弹出键盘问题

uniapp使用 input弹出键盘问题

时间:2025/9/2 19:44:00来源:https://blog.csdn.net/baidu_37302589/article/details/139498420 浏览次数:7次
前言:在h5开发没问题,运行到真机就出现点击触发键盘,遮挡datetime-picker弹窗
两种解决办法:
1、按官方文档说的使用:uni.hideKeyboard(),但是如果是弹窗中存在滚动效果就无效
2、根据使用的组件去做对应的处理:
2.1、使用uniapp原生input,重点是加 inputmode=“none” 属性
<input v-model="tableInfo.formState.startDate" inputmode="none" placeholder="开始日期" @click="openDate('startDate')" />
2.2、使用uview-plus框架的up-input组件

重点是加上只读属性 readonly ,然后使用一个新的view去覆盖input的位置,用于触发点击事件

<view style="position: relative"><up-inputv-model="formState.auditInfo.payTypeName"placeholder="请选择付款方式":suffixIcon="showSelect ? 'arrow-up' : 'arrow-down'"suffixIconStyle="color: #909399"readonly/><view style="position: absolute; top: 0; bottom: 0; left: 0; right: 0" @click="showSelect = true" />
</view>

以上两种方法都可以解决键盘弹出问题,自己根据实际情况酌情使用!

关键字:uniapp使用 input弹出键盘问题

版权声明:

本网仅为发布的内容提供存储空间,不对发表、转载的内容提供任何形式的保证。凡本网注明“来源:XXX网络”的作品,均转载自其它媒体,著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

我们尊重并感谢每一位作者,均已注明文章来源和作者。如因作品内容、版权或其它问题,请及时与我们联系,联系邮箱:809451989@qq.com,投稿邮箱:809451989@qq.com

责任编辑: