我正在学习反应。我有一个包含 4 个子页面的页面，我使用 React Router 来浏览这些页面。除了重新加载页面之外，一切正常。当我从页面“主页”转到“关于”或其他页面时，这是可以的，但是当我刷新页面时，它会再次渲染页面“关于”一秒钟，然后将页面更改为主页（主页是默认/第一页）。我希望它停留在当前呈现的页面，而不是每次刷新后返回主页。
index.js 文件中有我的代码，我在其中渲染整个应用程序并使用路由器：
<Provider store={store}>
<Router path="/" history={browserHistory}>
<Route path="/home" component={App}>
<Route path="/" component={Home}/>
<Route path="/allhotels" component={AllHotels}/>
<Route path="/addhotel" component={AddHotel} />
<Route path="/about" component={About} />
</Route>
<Route path="/signin" component={SignIn} />
<Route path="/signup" component={SignUp} />
</Router>
</Provider>, document.getElementById('root')
在“应用程序”中，我有导航，并且我在那里提供来自家庭、所有酒店等的其余同意。
App.jsx 中有代码
class App extends Component {
render() {
return (
<div className="app-comp">
<Navigation />
<div> {this.props.children}</div>
</div>
)
}
}
我还附上了显示我的问题的 gif。
https://gifyu.com/image/boMp https://gifyu.com/image/boMp
在后端，如果重要的话我会使用 Firebase。
提前致谢。
我找到了我的问题的原因。我在我的项目中也使用 Firebase，它导致了问题。
谢谢大家的帮助。
编辑=================================================== =====================
也许我会写下我是如何解决问题的以及问题的原因是什么。
所以我正在检查用户是否已在身份验证方法中登录。如果用户获得授权，我就会推送/到浏览器历史记录。
这是错误的，因为每个刷新方法都在执行，然后也调用了重定向。
解决方案只是检查在执行身份验证方法期间我是否位于登录页面。如果是登录页面，那么我正在推送/到 browserHistory 但如果没有，则不要推送任何内容。
firebaseApp.auth().onAuthStateChanged(user => {
if (user) {
let currentPathname = browserHistory.getCurrentLocation().pathname;
if( currentPathname === "/" || currentPathname === "/signin"){
browserHistory.push('/');
}
const { email } = user;
store.dispatch(logUser(email));
}
else {
browserHistory.replace('/signin');
}
})
我知道这不是一个很好的解决方案，但它有效，而且它只是为了学习反应而创建的家庭项目。 （顺便说一句，这个项目使用的是旧的 React Router 3.0，所以现在使用 browserHistory 可能已被弃用）
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
