React中路由器中的条件ClassName

时间:2020-10-30 09:18:09

标签: reactjs react-router react-hooks react-router-dom jss

我的react应用程序中有一个路由器,我只想在特定的路由上应用classes.root。 但是,下面的代码不起作用,因为它位于<Switch>内部。如您在我的代码中看到的那样,我只想在classes.rootLogin上应用Signup。 请在下面检查我的代码:

function Routes() {
  const classes = useStyles();
  return (
    <Router>
      <Suspense fallback={<h3>Loading...</h3>}>
        <Switch>
          <Route path="/goto" component={GoTo} />
          <div className={classes.root}>
            <Route path="/signin" component={Login} />
            <Route path="/signup" component={Signup} />
          </div>
          <PrivateRoute path="/" component={Private} />
        </Switch>
      </Suspense>
    </Router>
  );
}

export default Routes;

1 个答案:

答案 0 :(得分:2)

您需要将kafka-console-consumer --bootstrap-server brk:port --topic urTopic --from-beginning --property print.key=true --property print.timestamp=true 的定义方式从使用Route属性更改为使用component属性。我没有包括将道具传递到render组件,我只是展示了如何使用Login

如有必要,则应使用classes

<Login {...props}/>

对此

<Route path="/signin" component={Login} />
相关问题