react-native-keyboard-listener icon indicating copy to clipboard operation
react-native-keyboard-listener copied to clipboard

Please update to the latest React Native lifecycles

Open kockok opened this issue 4 years ago • 3 comments

Hello, this nifty plugin is great. Screenshot 2020-07-20 at 1 31 46 PM

kockok avatar Jul 20 '20 05:07 kockok

+1

Any screen which listens to these keyboard events throws a warning in development.

ChrisHatchDev avatar Mar 19 '21 20:03 ChrisHatchDev

Ended doing my own KeyboardListener file

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

const KeyboardListener: React.FC<{
  onDidShow: (e: any) => void;
  onDidHide: (e: any) => void;
}> = ({onDidShow, onDidHide}) => {
  useEffect(() => {
    if (onDidShow) Keyboard.addListener('keyboardDidShow', onDidShow);
    if (onDidHide) Keyboard.addListener('keyboardDidHide', onDidHide);

    return () => {
      Keyboard.removeListener('keyboardDidShow', onDidShow);
      Keyboard.removeListener('keyboardDidHide', onDidHide);
    };
  }, []);

  return null;
};

export default KeyboardListener;

and using like:

<KeyboardListener onDidShow={() => setKeyboardOpen(true)} onDidHide={() => setKeyboardOpen(false)} />

sturmenta avatar Apr 06 '21 17:04 sturmenta

I submitted a pull request but I guess he has not updated it. Here is the link to the complete remodeled version: https://github.com/aboss123/react-native-keyboard-listener/blob/patch-1/index.js

aboss123 avatar Apr 19 '21 13:04 aboss123