【React Native】ソフトウェアキーボードを閉じる

とても初歩的なことなのですが…今後も絶対に使うと思うので備忘録としてまとめ。
React Native でソフトウェアキーボードをコードで閉じる方法についてです。

使用するのは、React Native の Keyboard モジュールです。
公式サイトはこちらから。

Keyboard · React Native
https://reactnative.dev/docs/keyboard

 

使い方は至って簡単で、ソフトウェアキーボードを閉じたいタイミングで下記を実行するだけです!

// キーボードを閉じる
Keyboard.dismiss();

なお、当たり前ですが、下記の Keyboard モジュールのインポートはお忘れなく。

import { Keyboard } from 'react-native';

処理としては以上です!

React Native を使っていて分かったのですが、意外とソフトウェアキーボードって消えてくれないんですね。
入力欄にコメントを入力して、送信ボタンを押したあとも、フォーカスが外れないのかキーボードは開いたままだったりするので、コード側で閉じる処理を実行する必要がありました。
このあたりはアプリを使用する中でちょっとしたストレスにもなるので、気をつけたいですね。

 

以上、React Native でソフトウェアキーボードを閉じる方法でした。
ご参考になれば幸いです。

>株式会社シーポイントラボ

株式会社シーポイントラボ

TEL:053-543-9889
営業時間:9:00~18:00(月〜金)
住所:〒432-8003
   静岡県浜松市中央区和地山3-1-7
   浜松イノベーションキューブ 315
※ご来社の際はインターホンで「316」をお呼びください

CTR IMG