Vue Vant 移动端如何禁止手机调起自带的输入键盘

前言

前不久在公司用Vue2开发了一个手机充值项目,键盘组件用的vant2NumberKeyboard 数字键盘组件;上线后在IOS端只有一个vant数字键盘组件,但到了Android端,输入框一获取焦点不仅vant数字键盘弹出,连手机自带的键盘也弹出来,这用户体验极差,也不美观。这个兼容性的bug处理后就整理分享一下,希望能帮助到遇到同问题的朋友。

真实场景再现:

解决方案:

给输入框加上readonly只读属性就OK了

相关推荐
mCell7 小时前
从 TodoList 到 Microsoft To Do:全栈工程师到底要管什么?
前端·编程语言·全栈
阳光是sunny7 小时前
LangGraph实战教程:状态管理与`graph.invoke`入参深度解析
前端·人工智能·后端
神奇小汤圆7 小时前
深入解析 Flink Kafka Connector:原理、配置与最佳实践
前端·后端
科技之门7 小时前
百公里管网漏损分级定位实战方案2026
前端·人工智能·算法
xyphf_和派孔明7 小时前
企业级微前端项目完整创建步骤,第三步:配置 Vue 子应用
前端·javascript
自强的小白7 小时前
条件查询或查询全部时时前端请求数据等时间格式
前端
阳光是sunny8 小时前
LangGraph实战教程:一文搞懂图的状态(State)管理
前端·人工智能·后端
whyfail8 小时前
前端学 Spring Boot(5):从“你是谁”到“服务真的上线了”
前端·spring boot·后端
程序员黑豆8 小时前
鸿蒙开发:RelativeContainer相对布局组件实战——实现5个文本组件对齐
前端·华为·harmonyos
环境栈笔记9 小时前
高性价比指纹浏览器推荐与选型:如何对照价格和实际可用功能筛选候选
前端·人工智能·后端·自动化