详解关于React-Router4.0跳转不置顶解决方案
时间：2021-09-22 07:10:13|栏目：JavaScript代码|点击： 次
在使用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>
);
}
}
上一篇：create-react-app 修改为多入口编译的方法
栏 目：JavaScript代码
下一篇：最实用的JS数组函数整理
本文标题：详解关于React-Router4.0跳转不置顶解决方案
本文地址：http://www.codeinn.net/misctech/176671.html
