React js Material ui 排版

【问题标题】：React js Material ui TypographyReact js Material ui 排版
【发布时间】：2019-12-10 20:53:59
【问题描述】：

我有一个字体，当我悬停时，我希望光标看起来像一个按钮，以及如何将我的浏览器路由器路由添加到此点击？

    <Grid  item lg={12} md={12} sm={12} xs={12} >   
    <Typography noWrap className={classes.labelForgot} variant="subtitle2">
    Forgot password
      </Typography>
      </Grid>

我的路线应用：

<BrowserRouter>
    <div>
    <Header/>
    <Navigation/>
    <Container maxWidth="lg" >
      <Switch>
        <Route path="/" component={LandingPage} exact={true} /> 
        <Route path="/xd" component={AuthPage} exact={true} /> 
        <Route component={NotFoundPage} />
      </Switch>
      </Container>
    </div> 
  </BrowserRouter>

【问题讨论】：

标签： reactjs material-ui

【解决方案1】：

最好的方法是将 CSS-style-property 添加到您的类中。看起来像：

.labelForgot { cursor: pointer; }

然后，要使其链接到 URL，您需要将 useHistory() 用于无状态组件或将 withRouter() 用于类。在这种情况下，您可以访问历史记录并将其作为 history.push('/url') 推送。 (https://reacttraining.com/react-router/web/api/Hooks/usehistory)

如果你使用一个类，你将它导出为export default withRouter(MyClass)，然后你可以从propsthis.props.history.push('/url')访问历史记录

或者您可以使用 react-router 包中的<Link /> 并将它们设置为看起来像您的排版

【讨论】：