同一ID ReactJS上的不同组件

时间:2018-10-01 22:58:36

标签: reactjs react-router nav

是否可以在同一个id上的react-router中调用两个不同的组件?这是我的路由器:

<Route path="/Sessions" exact component={Sessions}/>
<Route path="/Sessions/:id" exact render={props => <GeekSessions{...props} /> }/>

我需要在此架构上添加其他组件(GeekDashSession)。

如果您有任何想法。

1 个答案:

答案 0 :(得分:0)

根据您在上面的评论中所说的,最好的选择是创建一个string组件,该组件将获取Wrapper并决定要渲染的组件。像这样:

Wrapper.js

user_role

然后您将像这样使用它:

class Wrapper extends React.Component { state = { user_role: null } componentDidMount() { // get user role from api with the user id this.setState({ user_role: role_from_api }); } render() { return !user_role ? "Loading ..." : user_role === "geek" ? <GeekSessions {...this.props} /> : <GeekDashSession {...this.props} /> } }