javascript - React Native 键盘关闭时的回调

标签 javascript reactjs react-native

我的屏幕上有一个日期选择器和一个文本输入。为了避免难看的过渡,我想在显示日期选择器之前关闭键盘。

目前,由于我不知道如何在键盘关闭时调用回调,因此我正在执行以下操作:

 const showBirthdayPicker = () => {
    // Dismiss the keyboard to avoid ugly transitions
    Keyboard.dismiss();

    setTimeout(() => {
      datePickerRef.current.show();
    }, 500);
 };

这可行,但此解决方案有一个问题...如果在运行此函数之前关闭键盘,用户将尝试不必要的 0.5 秒延迟...

还有其他方法可以做到这一点吗?我一直在看documentation键盘但关闭时没有回调。

最佳答案

根据文档,您可以监听keyboardDidHide事件来观察键盘是否被关闭。下面是一个简单的示例

  const showBirthdayPicker = () => {
    // Dismiss the keyboard to avoid ugly transitions
    Keyboard.addListener('keyboardDidHide', onKeyboardDidHide);
    Keyboard.dismiss();
  };
  const onKeyboardDidHide = (event) => {
    Keyboard.removeListener('keyboardDidHide', onKeyboardDidHide);
    datePickerRef.current.show();
  };

根据文档

Note that if you set android:windowSoftInputMode to adjustResize or adjustPan, only keyboardDidShow and keyboardDidHide events will be available on Android. If you set android:windowSoftInputMode to adjustNothing, no events will be available on Android. keyboardWillShow as well as keyboardWillHide are generally not available on Android since there is no native corresponding event.

关于javascript - React Native 键盘关闭时的回调,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/63685248/

相关文章:

javascript - html 包含许多类似的选择,这些选择在更改时会使用react

javascript - 在可见性隐藏和可见之间切换不起作用

javascript - 单击 "submit"按钮后如何保持在同一页面,并保留我在 JavaScript 中输入的日期

reactjs - React - useParams() 不会失败空/未定义检查

google-chrome-extension - 如何从浏览器设置 React 组件状态和 props

node.js - 如何从 Nodejs 服务器启用 CORS

javascript - 找不到 play-services-tasks-license.aar (com.google.android.gms :play-services-tasks-license:11. 8.0)

javascript - 切换到 Mongoose ,我不应该使用请求客户端吗?

javascript - 在 React Native 的 TabNavigator 中再次按下时滚动到当前选项卡的顶部

android - 您尚未接受以下 sdk 组件的许可协议(protocol) [android sdk build-tools 23.0.1]