在React Native中,当键盘打开时是否可以调用onPress?

7
用户需要在FlatList项目上点击两次,因为<TextInputautoFocus={true}。第一次点击时键盘会隐藏,下一次点击会调用onPress={this.GetItem.bind(this, item)}。是否有任何选项可以在第一次点击时调用GetItem()而不是点击两次。
演示:https://snack.expo.io/ByJ_yWehM
export default class App extends Component {
  GetItem (item) {
    console.log(item);
    Alert.alert(item);
  }
  render() {
    return (
      <View style={styles.container}>
        <TextInput
          autoFocus={true}
          style={styles.paragraph}
          keyboardType='web-search'
        >
          Change code in the editor and watch it change on your phone!
          Save to get a shareable url.
        </TextInput>
        <Card title="Local Modules">
          <View>
            <TextInput
              style={styles.searchField}
              placeholder="Type here to translate!"
              onChangeText={(text) => this.setState({text})}
            />

            <FlatList
                data={["akin","alike","close","comparable","like","similar","uniform","Allied","Analogous","Co-ordinate","Commensurate","akin","alike","close","comparable","like","similar","uniform","Allied","Analogous","Co-ordinate","Commensurate"]}
                renderItem={({item}) => (
                  <Text
                    style={styles.listField}
                    onPress={this.GetItem.bind(this, item)}
                    >{item}</Text>
                )}
              />
          </View>
        </Card>
      </View>
    );
  }
}

组件的目的是在用户在<TextInput>中搜索时,在<FlatList>中提供自动建议。

这可能不是你想要的答案,但是 键盘事件 对你有帮助吗? - bennygenel
@bennygenel 这个组件的目的是在用户在 <TextInput> 中搜索时,在 <FlatList> 中提供自动建议。 - Mo.
1个回答

18

keyboardShouldPersistTaps='handled'添加到您的FlatList中,将防止键盘在onPress时关闭。

<FlatList
    keyboardShouldPersistTaps='handled'
    data={["akin","alike","close","comparable","like","similar","uniform","Allied","Analogous","Co-ordinate","Commensurate","akin","alike","close","comparable","like","similar","uniform","Allied","Analogous","Co-ordinate","Commensurate"]}
    renderItem={({item}) => (
      <Text
        onPress={this.GetItem.bind(this, item)}
        >{item}</Text>
    )}
/>

always也可以作为keyboardShouldPersistTaps的值。

这里是keyboardShouldPersistTaps的官方文档


1
很棒的回答。这个 prop 没有在 FlatList 组件中记录,只有在 ScrollView 中记录。 - Hinrich

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接