taro h5 ios解决input不能自动获取焦点拉起键盘

描述:页面中有个按钮,点击跳转到第二个页面(有input),能直接获取焦点拉起键盘输入

安卓:

直接用focus()

ios:

focus无效,必须手动拉起

原理:

点击按钮的时候拉起一个此页面隐藏的input或者全局隐藏的input拉起键盘, 跳转后通过setSelectionRange 去设置光标

步骤一:定一个全局的隐藏input,并挂到window上
步骤二:第一个页面点击按钮,调起全局input, 然后跳转
步骤三:在第二个页面去设置页面中的input光标


这里的坑:

1)querySelector 是获取的页面第一个指定dom

  1. 必须用settimeout, 否则键盘能拉起,但是光标不在input中,不能直接输入

3)这里的input是原生的,可以直接获取到,如果用第三方ui, 比如taroui中的 AtSearchBar ,必须用最里面的input, 不能用AtSearchBar 上其他的dom, 并且要放到settimeout中, 否则为null



相关推荐
Engss4 天前
taro RN 左右滑动切换页面
前端·javascript·react.js·taro
Lyda8 天前
uniapp vs taro3 vue 小程序动态渲染
javascript·微信小程序·taro
哈哈皮皮虾的皮8 天前
react和taro之间的关系
前端·react.js·taro
少恭写代码10 天前
使用duxapp开发 React Native App 事半功倍
react native·小程序·taro·duxapp
少恭写代码13 天前
duxapp:基于Taro使用模块化开发,提升开发效率
react native·小程序·taro·duxapp
谢尔登14 天前
【Taro】初识 Taro
taro
书边事.22 天前
Taro实现微信小程序自定义拍照截图识别
微信小程序·小程序·taro
游小北23 天前
Taro + Vue 的 CSS Module 解决方案
css·vue.js·taro
程序设计实验室24 天前
项目完成小结:使用DjangoStarter v3和Taro开发的微信小程序
微信小程序·django·taro·web前端·djangostarter
二豆是富婆1 个月前
taro ui 小程序at-calendar日历组件自定义样式+选择范围日历崩溃处理
小程序·taro