CODEWITHSUNDEEP
javascriptreact-nativeexpo
JonathanBav
JonathanBav

Reputation: 1

am getting undefined is not an object (evaluating 'config.onComplete') when trying to listen to keyboard event in react native

import {Keyboard} from 'react-native';

Keyboard.addListener(
      'keyboardWillShow',
      keyboardWillShow
    );

am trying to listen to the keyboard events willShow and willHide and then do something about the events

Upvotes: 0

Views: 147

Answers (1)

wassim AJ
wassim AJ

Reputation: 458

Try the following function, it returns a boolean based on if the keyboard is open or not, and you can add actions to it

import {useEffect, useState} from 'react';
import {Keyboard} from 'react-native';

export function useKeyboard() {
  const [isKeyboardVisible, setKeyboardVisible] = useState(false);

  useEffect(() => {
    const keyboardWillShowListener = Keyboard.addListener(
      'keyboardWillShow',
      () => {
        setKeyboardVisible(true); // or some other action
      },
    );
    const keyboardWillHideListener = Keyboard.addListener(
      'keyboardWillHide',
      () => {
        setKeyboardVisible(false); // or some other action
      },
    );

    return () => {
      keyboardWillHideListener.remove();
      keyboardWillShowListener.remove();
    };
  }, []);

  return isKeyboardVisible;
}

Upvotes: 1

Related Questions