一行代码教你解决Scrollview和TextInput焦点获取问题
作者:wayne214 发布时间:2022-03-25 21:34:58
标签:Scrollview,TextInput,焦点获取
前言
业务开发中搜索框和列表的组合页面应该是比较常见的场景,那么有什么坑呢?
最近在开发过程就遇到了一个问题,输入搜索关键词查询接口返回数据后,点击列表项并返回上个页面时,发现需要两次点击,纳尼?页面示意图如下
通过日志以及逻辑分析发现两个问题:
1.第一次点击列表项无法触发onPress点击事件
2.第一次点击其实是使输入框失去焦点并隐藏键盘
知道问题在哪就有解决问题的方向了:点击列表项使输入框自动失去焦点,并触发onPress点击事件。
尝试方案
1.通过点击事件添加Keyboard.dismiss(),并使用输入框ref调用blur()方法
2.通过使用Scrollview包裹整个页面,添加keyboardShouldPersistTaps={'handled'}设置项(网上方案)
方案结果:
没有作用
没有效果,且上面的搜索框会一起滚动
最终方案
通过在技术群沟通,有位群友提出方案
scrollview 容器加 keyboardDismissMode="on-drag" 实践后,并未解决此问题
最终通过尝试在列表Flatlist中添加属性keyboardShouldPersistTaps={'always'}
成功解决
示例代码如下:
// 自定义输入框
<CustomizeSearchBar
value={searchText}
actionPress={onActionPress}
placeholder='请输入昵称/地址/姓名/手机号查询' onSearchChange={onSearchChange}/>
<FlatList
keyboardShouldPersistTaps={'always'}
style={{flex: 1}}
data={addressList}
renderItem={renderItem}
ListEmptyComponent={<ListEmpty type={2} />}
keyExtractor={(item) => item.id}
/>
复制代码
附RN中文网对keyboardShouldPersistTaps
的解释说明:
最后
写了Android和Flutter混合开发一年多,又开始写RN了,就想一个圆一样。
小伙伴们,你们现在是做RN,Flutter,原生,还是转行了?
来源:https://juejin.cn/post/7166987535216803848


猜你喜欢
- 今天分享的是用系统自带的相机实现一键拍照功能。public class MainActivity extends AppCompatActi
- java就业前需要掌握的专业技能1.熟练的使用Java语言进行面向对象程序设计,有良好的编程习惯,熟悉常用的Java API,包括集合框架、
- 1. 运算符是什么?1.1 定义:对常量和变量进行运算操作的符号程序对数据进行运算时要用运算符1.2 常见运算符的概述1.3 表达式1.3.
- 前言如今,企业级应用程序的高性能安全加密的常见场景是同时支持HTTP和HTTPS两种协议,这篇文章考虑如何让Spring Boot应用程序同
- 在学习SpringBoot的过程中遇到一个问题,因为SpringBoot是集成了tomcat的,所以项目是打成jar包,通过SpringMV
- 本文实例为大家分享了C#添加Windows服务的具体方法,供大家参考,具体内容如下源码下载地址:http://xiazai.jb51.net
- 注:这里只是说一下sendmessage的一个过程,post就类似的如果我们需要发送消息,会调用sendMessage方法 public f
- Android Studio是谷歌推出一个Android集成开发工具,基于IntelliJ IDEA。它类似于Eclipse ADT,And
- 前言定时/计划功能在Java应用的各个领域都使用得非常多,比方说Web层面,可能一个项目要定时采集话单、定时更新某些缓存、定时清理一批不活跃
- 本文实例为大家分享了Android实现可折叠式标题栏的具体代码,供大家参考,具体内容如下先看效果图:一、实现步骤:1、布局文件<?xm
- 本文实例为大家分享了C语言实现餐饮管理系统的具体代码,供大家参考,具体内容如下#include <stdio.h>#includ
- Required String parameter xxx is not present类型异常异常报错学习Spring Boot的时候做一
- try就像一个网,把try{}里面的代码所抛出的异常都网住,然后把异常交给catch{}里面的代码去处理。最后执行finally之中的代码。
- 建造者模式是Java中一种创建型设计模式,它的主要目的是将一个复杂对象的构建过程分解为多个简单对象的构建过程,并且使这些构建过程按照一定的顺
- 之前写过3篇手势密码的demo,不过没有集成到真实的企业项目中,这几天正好领到一个手势密码项目,昨天刚好弄完,今天抽空整理下,目前还没有完善
- 一、项目简述本系统功能包括: 系统管理,招生计划,学生管理,录取结果,自动分配,调剂管理等等。二、项目运行环境配置:Jdk1.8 + Tom
- 释一:属性的访问器包含与获取(读取或计算)或设置(写)属性有关的可执行语句。访问器声明可以包含 get 访问器或 set 访问器,或者两者均
- app的启动方式: 1.)冷启动 当启动应用时,后台没有该应用的进程,这时系统会重新创建一个新的进程分配给该应用,这个启
- 本文实例为大家分享了Android简单使用PopupWindow的的具体代码,供大家参考,具体内容如下思路1.在res下面创建一个menu文
- 今天我们来编写一个缩放效果的ImageView ,网上有很多人都讲了这些。但有许多人都直接使用了库文件,那么我们今天做的是直接上代码编写一个