React Native:e.nativeEvent.key =='Enter'不起作用

时间:2018-11-27 21:19:53

标签: react-native textinput

这个问题与this非常相似,但是,由于某些原因,除回车键(Enter键)之外,每个键都可以正常工作。如果密码正确,我想要的是将用户转到下一页。任何帮助将不胜感激

//代码

        <TextInput
                style={styles.txtfield}
                placeholder="Password"
                placeholderTextColor = 'rgba(249, 129, 37, 1)'
                secureTextEntry={true}
                onChangeText={ password => this.setState({ password })}
                keyboardType="default"
                returnKeyType="next"                        
                onKeyPress={ (event) => {
                    if(event.nativeEvent.key == "Enter"){
                        alert(event.nativeEvent.key) // doesn't output anything nor execute the signin function
                        // this.signIn();
                    } 
                    else {
                        alert('Something else Pressed') // show a valid alert with the key info
                    }
                }}
            />

1 个答案:

答案 0 :(得分:1)

仅当存在多行 TextInput时,您才会为 Enter 键获得 onPress 事件。

对于单行TextInput,您将在 onSubmitEditing 方法中获得“ Enter”或“ Submit”按键事件。

  <TextInput
            style={styles.txtfield}
            placeholder="Password"
            placeholderTextColor = 'rgba(249, 129, 37, 1)'
            secureTextEntry={true}
            onChangeText={ password => this.setState({ password })}
            keyboardType="default"
            returnKeyType="next"
            onSubmitEditing={()=>{
                alert('on submit') // called only when multiline is false
            }}                        
            onKeyPress={ (event) => {
                if(event.nativeEvent.key == "Enter"){
                    alert(event.nativeEvent.key) //called when multiline is true
                    // this.signIn();
                } 
                else {
                    alert('Something else Pressed') 
                }
            }}
        />