現在のページにReact + React-Routerが一時的に残っている場合にユーザーに警告

Question

myStateがtrueの間にユーザーがアクティブページ（ウィンドウ/タブ/ etc）をページから別のページに変更しようとすると、 React JSのユーザーはreact-routerです。

ヘルプTransitionHookとリアクタールーターのConfirming Navigationの記事で実装しようとしました。これらは、ユーザーがページを閉じたり、リロードしたりしたいときにのみ表示されます。一方、ユーザーがちょうどのページを一時的に閉じることを知らずに、それを閉じなくても知る必要があるのに対して、。

どうすればこの問題を解決できますか？

Answer 1

「ページを離れる」とは、ページが開いているが別のウィンドウがポップアップしている場合は、document.hasFocusプロパティの使用を検討することができます。

componentDidMount: function(){ setInterval(()=>{ if (document.hasFocus()){ this.checkServerState(); } }, },