以前、検索機能付きの Select 要素を実装できるライブラリ「React Select」をご紹介しましたが、こちらのライブラリがなんと iOS で使えないということが判明しました…！
表示は正しく行えるのですが、Select 内の要素をタップして選択した時に、呼ばれるはずの onChenge が呼ばれず、値の更新ができないという状況でした。
Android だと正常に動いていたので、今更別のに変えたくない…！ということで、なんとか出来ないか挑戦することにしました。
なお、こちらの機能は、Cordova で開発している iOS 及び Android アプリに実装しようとしています。
…アプリ上で動かそうとしているのも影響がありそうですね。
React Select の公式サイトはこちらから。
なお、インストール方法や実装方法については、以前の記事で紹介しましたので、今回は省略させていただきます。
さて、修正方法ですが、もともと React Select の Props に用意されている menuIsOpen を使いました。
この menuIsOpen オプションは、Select 要素を最初から展開しておくかどうかを指定でき、こちらに true を指定します。
そうすると、メニューが最初から開きっぱなしになるのですが、こうしておくと、項目をタップして選択した際に、iOS でも onChange が無事に呼ばれ、値の更新処理を行うことができました。
…この menuIsOpen を使おうと思ったのは本当に偶然だったのですが…結果的にうまくいってよかったです。
ただ、メニューが開きっぱなしになるので、場合によっては UI に影響が出る場合も考えられますので、そこは調整をしていただく必要があるかもしれません。
以上、React Select の onChange が呼ばれず、値が更新できない時の対処法についてでした。
ご参考になれば幸いです。
