代码之家 › 专栏 › 技术社区 › Ralph David Abernathy

如何将React路由器链路组件的重定向延迟1秒?

delay react-router hyperlink reactjs javascript

Ralph David Abernathy · 技术社区 · 6 年前

单击链接时,浏览器会尝试尽快重定向用户。如何为该过程添加1秒延迟?

我有以下链接:

  <Link
    to={{
      pathname: `pathname`,
      hash: `#hash`,
    }}
    onClick={this.delayRedirect}
  >

我的delayRedirect函数如下所示:

  delayRedirect() {
    // not sure what to put here, to delay the redirect by 1 second
  }

有什么想法吗?谢谢!

1 回复 | 直到 6 年前

Shishir Arora 6 年前

import { withRouter } from 'react-router'

class Home extends Component {

  delayRedirect = event => {
      const { history: { push } } = this.props;
      event.preventDefault();
      setTimeout(()=>push(to), 1000);
    }
  };
  <Link
    to={{
      pathname: `pathname`,
      hash: `#hash`,
    }}
    onClick={this.delayRedirect}
  >
}

export default withRouter(Home);