时间戳

首页 > 解决方案 > 我在访问 ReactJS 的页眉和页脚中的道具时遇到问题。我必须在每一页上使用页眉和页脚吗？

reactjs - 我在访问 ReactJS 的页眉和页脚中的道具时遇到问题。我必须在每一页上使用页眉和页脚吗？

问题描述

我必须在每一页上使用页眉和页脚。所以我给出了页眉和页脚之间的路线。

class App extends Component {
  render() {
    return(
      <Router>
  <Header />
    <Switch>
          <Redirect exact from="/" to="dashboard" />
          <Route path="/dashboard" component={Dashboard} />
          <Route path="/login" component={Login}/>
          <Route path="/profile" component={Profile}/>
          <Route path="/register" component={Register}/>
        </Switch>
  <Footer/>
    </Router>
    )
  }
}
export default App

标签： reactjs

解决方案

在同一“层次结构”中的组件之间传递 props 很简单——也就是说，共享某种形式的父子关系的组件。如果我正确理解您的问题，听起来您想通过出现在每个页面上的页眉和页脚中的道具访问某些数据，尽管它们在某种程度上与您在路线中建立的核心组件层次结构隔离。

在这种情况下，您应该考虑并且我建议您使用本地状态管理工具，例如Redux，它可以为您的应用程序建立某种形式的全局状态——任何组件都可以访问这些数据（通过 prop ) 并更新它，无论它可能呈现/位于何处——这将包括您的页眉和页脚。您可以在此处查看文档。

推荐阅读