react-onsenuiのダイアログ機能を使ってバリデーション処理を作っていたのですが
ダイアログを閉じた直後にクラッシュする不具合に遭遇。
TypeError: Cannot read property ‘hide’ of null
hideって何が隠れているのか分からないしそんなDOM作った覚えないしで
手詰まりだったのですが
同じ構成だった別ファイルのソースコードと見比べてみると
tryの前でsetStateをしていたのが発覚。ここで重い処理をしていたらもしかしてと思い
外してみるとまさにビンゴでした。
reactはページ移動の際にデフォルトでダイアログが閉じるようになっているようで
try/catchの寸前でthis.state({isDialog: !this.state.isDialog})を追加、つまり
二重にsetStateしてしまい、ダイアログを閉じようとしたstateは既に遷移した後に行われるので
ダイアログ(DOM)は存在せず
nullになってしまうというからくりでした。
処理に時間がかかる非同期処理の寸前でsetStateをしないだけでこのような事故を
回避することができます。
