代码之家  ›  专栏  ›  技术社区  ›  Darren

当Scrolly不是0时,window.addEventListener未更新路由更改状态

  •  0
  • Darren  · 技术社区  · 7 年前

    我在加 class 到A header 通过 setState 使用 addEventListener 在里面 componentDidMount . 这个 state 属于 scrolling 设置为 false 0 属于 scrollY 在卷轴上, 状态 更新为 true 和A 添加。

    作为一个例子

    componentDidMount() {
      window.addEventListener('scroll', this.handleScroll);
    }
    
    componentWillUnmount() {
      window.removeEventListener('scroll', this.handleScroll);
    }
    
    handleScroll = () => {
      if (window.scrollY === 0 && this.state.scrolling === true) {
        this.setState({ scrolling: false });
      } else if (window.scrollY !== 0 && this.state.scrolling !== true) {
        this.setState({ scrolling: true });
      }
    };
    

    在盖茨比 layout . 当用户返回到页面顶部时,它可以在页面和模板之间完美地工作。

    但是,在某些情况下,例如 route 通过A改变 modal 或者用户在浏览器上回击,该操作保留上一个 斯克洛利 位置。

    在这种情况下 斯克洛利 不是 但是 状态 属于 滚动 仍在显示 . 我想这是因为即使 斯克洛利 显示实际位置, 状态 滚动 最初是 直到用户滚动。这在 console

    我怎样才能保证途中的交通 状态 滚动 更新为 如果 斯克洛利 不是 ?

    1 回复  |  直到 7 年前
        1
  •  1
  •   coreyward    7 年前

    你应该跑你的 handleScroll 方法在实例化后捕获初始状态。现在,您依赖的是滚动位置在最上面,但是正如您所发现的,返回历史记录会导致不同的初始状态。

    componentDidMount() {
      window.addEventListener('scroll', this.handleScroll);
      this.handleScroll();
    }