乐趣区

关于react-native:reactnative-TextInput-无法自动失去焦点需要点击多次切换到其他组件

场景形容

比拟常见的需要是有个输入框,旁边有个搜寻按钮或者发送按钮。点击输入框的时候会唤起虚构键盘,输出文字点击旁边的按钮或者切换其余组件,点击第一次是收起键盘,无奈触发点击事件,须要再点击一次。

解决方案

1. 首先认识一下:keyboardShouldPersistTaps

官网形容

keyboardShouldPersistTaps
如果以后界面有软键盘,那么点击 scrollview 后是否收起键盘,取决于本属性的设置。(译注:很多人反馈 TextInput 无奈主动失去焦点 / 须要点击屡次切换到其余组件等等问题,其要害都是须要将 TextInput 放到 ScrollView 中再设置本属性)

'never'(默认值),点击 TextInput 以外的子组件会使以后的软键盘收起。此时子元素不会收到点击事件。'always',键盘不会主动收起,ScrollView 也不会捕获点击事件,但子组件能够捕捉。'handled',当点击事件被子组件捕捉时,键盘不会主动收起。这样切换 TextInput 时键盘能够放弃状态。少数带有 TextInput 的状况下你应该抉择此项。false,已过期,请应用 'never' 代替。true,已过期,请应用 'always' 代替。类型    必须
enum('always', 'never', 'handled', false, true)

这个是 ScrollView 的属性,所有继承 ScrollView 的都有此属性。

2. 将 TextInput,用 ScrollView 包裹起来,并且设置此属性为 always 或者 handled(更多的时候用这个)

退出移动版