首页 > 解决方案 > React Router - 单击主页中的主页链接时主页组件不会重新加载

问题描述

我有一个带有“/”渲染主页组件的简单反应路由器。我在“/”中,它呈现 home 组件。当我点击主页链接时,即使它已经在“/”中,如何让它刷新?

在上下文中,想想 YouTube,如果我单击左上角的 YouTube 徽标,它会刷新页面。目前在我的反应项目中,如果我在家里点击主页链接,它什么也不做。

const MainRoutes = () => (
  <Router>
    <div>
      <NavBar />
      <Route exact path="/" component={Home}/>
      <Route exact path="/login" component={Login}/>
      <Route exact path="/post" component={Post}/>
      <Route exact path="/about" component={AboutRoutes}/>
      <Route exact path="/listing/:handle" component={Listing}/>
      <Route exact path="/mylistings" component={MyListings}/>
    </div>
  </Router>
)

标签: reactjsreact-routercomponentsrefreshhistory

解决方案


您可以使用中间函数来实现这一点,

<Route path='/' component={()=><Home/>} />

推荐阅读