reactjs - 如何使用 React 中的 onScroll 事件使用 React-Router 移动到另一个页面

Question

我目前在 React 中有一个英雄图像组件，当用户尝试向下滚动页面时，我想移动到购物页面，就好像它们已连接，而实际上它们没有连接。这将使我的其他导航更容易，同时仍然保持所有组件和路线分开。

class Home extends Component {
  constructor(props) {
    super(props);

    this.handleScroll = this.handleScroll.bind(this);
  }

  handleScroll() {
    let history = useHistory();
    history.push('/categories');
    console.log('done');
  }

  render() {
    return (
      <Hero onScroll={this.handleScroll}>

我的 console.log 永远不会被执行。

标签： reactjsreact-routeronscroll

Answer 1

让我们用onWheel改变onScroll

<Hero onWheel={this.handleScroll}>