React Js 实现锚点定位的方法

滚动容器 scrollTo()

滑动到对应位置，有过渡效果。

let scrollElement = document.getElementById(scrollId);    // 对应id的滚动容器
let anchorElement = document.getElementById(anchorId);  // 需要定位看到的锚点元素
if(scrollElement) {
    scrollElement.scrollTo({top: anchorElement.offsetTop, behavior: "smooth" });
}

scrollTo接口文档

监听容器滚动

    let scrollElement = document.getElementsByClassName('contant')[0]; 
    scrollElement.onscroll = (e) => {
      const scrollTop = e.target.scrollTop;
      ...
    }