为什么我的滚动位置没有反应？

Question

我正在尝试在滚动时使导航导航处于活动状态。因此，当您滚动浏览每个部分时，导航将处于活动状态。有点像在这里看到的： https://codepen.io/rishabhp/pen/aNXVbQ

我遇到的问题是我的一些号码不正确。这是代码：

handleScroll = () => {
    let sections = document.querySelectorAll('.deal-details__container'),
        nav = document.querySelectorAll('.overview-nav'),
        navHeight = nav[0].clientHeight;

    let totalScroll = document.body.getBoundingClientRect().top;

    window.addEventListener('scroll', () => {

        sections.forEach(section => {
            let topOffset = section.getBoundingClientRect().top;
            let top = topOffset - navHeight,
                bottom = top + section.clientHeight;

            if (totalScroll >= top && totalScroll <= bottom) {
                this.setState({ activeSection: true });
            } else {
                this.setState({ activeSection: false });
            }
        });
    });
    console.log(totalScroll);
};

例如，我在forEach中的totalScroll仅等于-20或类似的值。

我觉得我缺少一些简单的东西。有什么想法吗？