React-Router4.0跳转不置顶解决方案
在使用react-router时会遇到奇怪的问题,比如当我们从首页进入详情页的时候,首页跳转到详情页,首页滚动的位置,进入到详情页的时候也会被记录下来,原因是由于共享了同一个history,所以对记录有所保留,这显然不符合我们的浏览习惯。
总结种解决方案:
方案一
<Router onUpdate={() => window.scrollTo(0, 0)} history={hashHistory}>
<Route path="/" 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>
);
}
}本文内容仅供个人学习、研究或参考使用,不构成任何形式的决策建议、专业指导或法律依据。未经授权,禁止任何单位或个人以商业售卖、虚假宣传、侵权传播等非学习研究目的使用本文内容。如需分享或转载,请保留原文来源信息,不得篡改、删减内容或侵犯相关权益。感谢您的理解与支持!