ReactベースのWebサイトでのスクロールの設定

最近React+Reduxを利用してウェブサイトを書いていて、1つのページがスクロールする問題に遭遇しました.jQueryを導入したくないし、他のlibraryを導入してこのことを専門にしたくないので、少し解決策を検討しました.
シーンがページ上部にスクロールされると
これは簡単です.windowオブジェクトにはscrollToメソッドがあります.このメソッドでいいです.

scrollTo(0, 0)

シーン2ページのある場所にスクロール
ターゲット位置のidを設定し、aラベルに対応するidを指定すればよい

     
....
 をスクロール

シーン3をページのある位置にスクロールしてからシフト
シーン2の方法を使用すると、ターゲットの位置がページの先頭になります.しかし、今では多くのサイトがページの一番上にナビゲーションバーを持っています.このように、ターゲット位置はナビゲーションバーに隠されます.したがって、ターゲット位置をページの先頭にスクロールさせるのではなく、先頭にスクロールしてから少し下に移動します.この場合、上記2つの技術を組み合わせて、スクロールバーの位置をscrollTopで取得し、簡単なオフセット処理を行う必要があります.

//      50
function handleScroll() {
  //   a  ，         ，        ，    setTimeout
  setTimeout(function() {
   var top = window.document.scrollTop;
   scrollTo(0, top - 50);
  }, 100);
}

また、aの設定は

 をスクロール

補足:各種ブラウザと互換性を持つために、scrollTopを取る方法は以下の通りであるべきである.

var top = document.body.scrollTop || document.documentElement.scrollTop || window.pageYOffset;