我花了两天时间解决这个问题,问题是:
当我将 TextInput 放入 Flatlist 中时,TextInput 的行为发生了变化,键盘在写入每个字符后失去焦点。
版本React-native:0.63.2,react:16.13.1,react-dom:16.13.1,expo:~42.0.1,
重现步骤
---> 问题是:在键盘中按下每个字符后,键盘隐藏
国家声明:
const [inputSearch, setInputSearch] = useState(null);
Run Code Online (Sandbox Code Playgroud)
TextInput 位于 Flatlist 内:
<View style={styles.container}>
<StatusBar
backgroundColor="#11131B"
barStyle="light-content"
/>
<View style={{width: '100%', flex: 1 , backgroundColor: 'white', marginTop: 5}}>
<FlatList
contentContainerStyle={{alignItems: 'center',paddingHorizontal: 20}}
keyExtractor={(item) => (Object.keys(item).length === 0) ? "" : item.id.toString()}
width= {width}
numColumns={2}
ListHeaderComponent={() =>
<View style={{flexDirection:'column',justifyContent:'space-between'}}>
<Text style={{color:Colors.dark1, fontSize:14, marginBottom: 5}}>Search :</Text>
<TextInput style={styles.input} value={inputSearch} onChangeText={setInputSearch} placeholder="Username"/>
</View> …Run Code Online (Sandbox Code Playgroud) lost-focus reactjs react-native react-native-flatlist react-native-textinput