Question

请检查小吃链接， https://snack.expo.io/@banid/textinput 每当我调用setState（）时，筛选器视图上的TextInput（显示何时按下按钮）都会隐藏键盘。我调用setState来更新TextInput的值。因此，我无法在TextInput上连续输入。这是一个错误还是我做错了什么？谢谢

Answer 1

问题是您正在创建一个全新（匿名）函数，该函数会在每次更新时呈现FlatList的标题

<FlatList .... ListHeaderComponent={() => this.showHeader()} />

因此，正在创建一个新的TextInput，而不是更新现有的TextInput。

解决方案：

更改ListHeaderComponent={() => this.showHeader()}

作为{HeaderComponent的ListHeaderComponent={this.showHeader}可以是一个函数

https://facebook.github.io/react-native/docs/flatlist#listheadercomponent

类似问题： https://github.com/react-native-training/react-native-elements/issues/559

Answer 2

似乎在每个setState之后，焦点都从TextInput上移开了，可以使用以下解决方法：

更改

this.setState({
    filterSearchText: text,
    data: newData,
});

收件人

this.setState({
    filterSearchText: text,
    data: newData,
}, () => {
    this.searchInput.focus();
});

这是什么，它会在调用setState之后将焦点重新带回searchInput

React Native TextInput setState（）隐藏键盘

2 个答案: