Router4.0跳转不置顶解决方案

这篇文章主要介绍了详解关于React-Router4.0跳转不置顶解决案,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

在使用react-router时会遇到奇怪的问题,比如当我们从首页进入详情页的时候,首页跳转到详情页,首页滚动的位置,进入到详情页的时候也会被记录下来,原因是由于共享了同一个history,所以对记录有所保留,这显然不符合我们的浏览习惯。

总结种解决方案:

方案一

<Router onUpdate={() => window.scrollTo(0, 0)} history={hashHistory}> <Route path="https://www.jb51.net/" component={ App }> </Router>

方案二

class Protol extends React.Component { constructor(props) { super(props); } componentDidUpdate(prevProps) { if (this.props.location !== prevProps.location) { window.scrollTo(0, 0) } } render() { return ( <div> <Header/> {this.props.children} <Footer/> </div> ); } }

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

您可能感兴趣的文章:

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:http://www.heiqu.com/6fee67c8d12f1f59a6a2e1780d2aca60.html