Skip to main content
Logo Appt Light

Keyboard shortcuts on React Native

Most people operate their smartphones with touch, but some people use an external keyboard. Learning and using keyboard shortcuts can save you a lot of time. Shortcuts should always use a modifier key, such as CTRL or CMD to avoid clashing with system shortcuts.

React Native does not support binding custom key events for shortcuts. The package react-native-keyevent allows you to capture external keyboard keys. However, it only works on Android.

componentDidMount() {
    KeyEvent.onKeyMultipleListener((keyEvent) => {
        console.log(`onKeyMultiple keyCode: ${keyEvent.keyCode}`);
        console.log(`Action: ${keyEvent.action}`);
        console.log(`Characters: ${keyEvent.characters}`);
    });
}

componentWillUnmount() {
    KeyEvent.removeKeyMultipleListener();
}

Feedback?

Let us know!