ブラウザ自身またはタブを閉じる時に、大事な未保存情報がある場合、beforeunloadイベントハンドラーを登録することで、閉じる処理を止めて確認ダイアログを表示することが出来ます。 今回はreactでbeforeunloadハンドラーを書く時にはまったことをメモします。 結論 確認ダイアログの表示・非表示と表示するメッセージのコントロールはbeforeunloadハンドラーのevent.returnValueだけでコントールすれば良い。 beforeunloadハンドラーでメッセージ文字列を返すような実装だと、変な動きがあるからです。 環境 Win7+IE11 MacOS 10.13.5 + Chrome 70.0 reactでの書き方 export default class MyComp extends React.Component { constructor(props) { s