首页 > 解决方案 > 针对特定组件的 React Router Links

问题描述

假设我有一个应用程序正在使用react-router-dom

App.js
class App extends Component {
   render() {
      return (
        <Fragment>
          <Switch location={location}>
            <Route exact path="/" component={LoginPage} />
            <Route loggedIn={loggedIn} path="/dashboard" component={Dashboard} location={location} />
          </Switch>
        </Fragment>
      )
   }
}

然后在我的仪表板组件中,我有一个链接,但我希望链接仅根据匹配更新我的 ChatConversation 组件match.params.id

Dashboard.js
<Fragment>
  <Left>
    <SettingsMenu />
    <ConversationsContainer />
  </Left>
  <Right>
    <Route path="/dashboard/conversations/:id" component={ChatConversation} />
  </Right>
</Fragment>

有没有办法让它只更新我的组件ChatConversation而不更新位于我的开关内的整个应用程序组件App.js

ChatConversation.js
<Fragment>
  Conversation ID: {match.params.id}
</Fragment>

标签: reactjsreact-router

解决方案


推荐阅读