Javascript 反应本机：键盘显示和隐藏侦听器不工作

嗨，我试图在键盘的show和hide事件中调用一些函数，我从react native docs复制了确切的代码，但我不明白为什么它不工作！ 以下是我的组件：

import React, { useEffect } from 'react';
import { StyleSheet, View, TouchableOpacity, Image, TextInput, Platform, KeyboardAvoidingView, Keyboard } from 'react-native';
import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import { deviceScreenDimensions } from '../../helpers/functions/common';

const CameraCapturedBody = ({
  caption,
  capturedPhotoPath,
  onUploadClick,
  onCaptionChange,
  isLoading
}) => {
  const _keyboardDidShow = () => {
    console.log("Keyboard Shown");
  };

  const _keyboardDidHide = () => {
    console.log("Keyboard Hidden");
  };

  useEffect(() => {
    Keyboard.addListener("keyboardDidShow", _keyboardDidShow);
    Keyboard.addListener("keyboardDidHide", _keyboardDidHide);

    // cleanup function
    return () => {
      Keyboard.removeListener("keyboardDidShow", _keyboardDidShow);
      Keyboard.removeListener("keyboardDidHide", _keyboardDidHide);
    };
  }, []);

  const photoPath = Platform.OS === 'android' ? capturedPhotoPath : capturedPhotoPath.substring(7);

  return (
    <KeyboardAvoidingView
      behavior={Platform.OS == "ios" ? "padding" : "height"}
      style={{ flex: 1 }}
    >
      <View style={styles.preview}>
        <Image source={{ uri: photoPath, isStatic: true }} style={styles.capturedImage} />
        <View style={styles.captionInputContainer}>
          <TextInput
            autoCapitalize="none"
            placeholder="Enter a caption"
            value={caption}
            onChangeText={onCaptionChange}
            style={styles.textInput}
            placeholderTextColor="white"
            underlineColorAndroid="white"
          />
          <TouchableOpacity style={styles.capture} onPress={onUploadClick} disabled={isLoading}>
            <Icon name="upload" color="#fff" size={45} />
          </TouchableOpacity>
        </View>
      </View>
    </KeyboardAvoidingView>
  );
};

const styles = StyleSheet.create({
  preview: {
    flex: 1,
    justifyContent: 'flex-start',
    alignItems: 'center',
    flexDirection: 'column',
    width: '100%'
  },
  capturedImage: {
    height: '100%',
    width: '100%'
  },
  textInput: {
    width: '80%',
    color: 'white'
  },
  capture: {
    paddingHorizontal: 10
  },
  captionInputContainer: {
    position: 'absolute',
    bottom: 0,
    alignSelf: 'flex-end',
    backgroundColor: 'rgba( 0, 0, 0, 0.5)',
    flexDirection: 'row',
    width: deviceScreenDimensions.width,
    paddingVertical: 15,
    paddingLeft: 10,
    height: 80
  }
});

export default CameraCapturedBody;

import React，{useffect}来自“React”；
从“react native”导入{样式表、视图、触摸不透明度、图像、文本输入、平台、键盘AVOIDGVIEW、键盘}；
从“反应本机矢量图标/材料通信图标”导入图标；
从“../../helpers/functions/common”导入{deviceScreenDimensions}；
常数CameraCapturedBody=({
说明文字
捕获光病，
联布行动，
一旦改变，
卸载
}) => {
常量键盘显示=（）=>{
console.log（“显示键盘”）；
};
常量键盘隐藏=（）=>{
console.log（“键盘隐藏”）；
};
useffect（（）=>{
键盘.addListener（“keyboardDidShow”，_keyboardDidShow）；
addListener（“keyboardDidHide”、_keyboardDidHide）；
//清理功能
return（）=>{
键盘。removeListener（“keyboardDidShow”，“U keyboardDidShow”）；
键盘.removeListener（“keyboardDidHide”，U keyboardDidHide）；
};
}, []);
const photoPath=Platform.OS=='android'？capturedPhotoPath:capturedPhotoPath.substring（7）；
返回(
);
};
const styles=StyleSheet.create({
预览：{
弹性：1，
justifyContent:“flex start”，
对齐项目：“居中”，
flexDirection:'列'，
宽度：“100%”
},
capturedImage：{
高度：“100%”，
宽度：“100%”
},
文本输入：{
宽度：“80%”，
颜色：“白色”
},
捕获：{
水平方向：10
},
标题输入容器：{
位置：'绝对'，
底部：0，
alignSelf:“柔性端”，
背景颜色：“rgba（0,0,0,0.5）”，
flexDirection:'行'，
宽度：设备屏幕尺寸.width，
填充垂直：15，
paddingLeft:10，
身高：80
}
});
导出默认CameraCapturedBody；

请告诉我是否必须将事件侦听器放置在其他位置或进行其他更改。提前谢谢