为什么“输入"键不会在 React Native 中触发 onKeyPress? [英] Why does the "Enter" key not trigger onKeyPress in React Native?

问题描述

我在我的文本输入中添加了一个 onKeyPress 事件侦听器，这样当用户在电话键盘上单击完成或转到或输入"时，它会调用我的 searchProducts 函数.我希望有一个 onSubmit 类型的事件侦听器选项，但找不到类似的东西，所以现在我只好简单地检查每个按下的键.当按下诸如j"或x"之类的字符键时，它会触发 onKeyPress 事件并调用我的 searchProducts 函数.但是，当我用鼠标单击完成或按键盘上的 Enter 键时，没有任何反应.我如何让它触发 onKeyPress 事件侦听器?

I have added an onKeyPress event listener to my text input so that when a user clicks done or go or "enter" on the phone keyboard it will call my searchProducts function. I was hoping for an onSubmit type of event listener option but was not able to find anything like that so now I have resorted to simply examining each key that was pressed. When a character key is pressed such as 'j' or 'x' it triggers the onKeyPress event and calls my searchProducts function. However, when I click done with the mouse OR hit the enter key on the keyboard nothing happens. How do I get this to trigger the onKeyPress event listener??

searchProducts = (e) => {
    if (e.nativeEvent.key == "Enter"){
        this.props.searchFunc(this.state.term);
    }
}

<TextInput 
    ref='searchBar'
    style={styles.searchInput} 
    placeholder={placeholder}

    onChangeText={this.searchSuggestions}
    onKeyPress={this.searchProducts.bind(this)}
    underlineColorAndroid="transparent" 
/>

推荐答案

您可以使用 onSubmitEditing 即:

当文本输入的提交按钮被调用时的回调按下.如果指定了 multiline={true}，则无效.

Callback that is called when the text input's submit button is pressed. Invalid if multiline={true} is specified.

按下键盘上的完成"按钮后会调用它.

It will be called after pressing 'done' button on keyboard.

这篇关于为什么“输入"键不会在 React Native 中触发 onKeyPress?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！