材质ui抽屉中的渲染链接 [英] Render Link in material ui Drawer

问题描述

我想将我的react-router链接添加到 Drawer .我试过了:

I want to add my react-router links to Drawer. I tried this:

<Drawer width={200} open={this.state.drawerOpen} docked={false} onRequestChange={this.toggleDrawer}>
   <Link to="/businesspartners">
      <MenuItem onTouchTap={this.toggleDrawer.bind(this, false)}
                rightIcon={<CommunicationBusiness />}
      >
         Business Partners
      </MenuItem>
   </Link>
</Drawer>

我的问题是链接将显示下划线(如下面的图片).

My problem is that the link will render underlined (like the image below).

推荐答案

对链接使用内联样式 textDecoration:'none'.< Link> 被呈现为标准的< a> 标记，这就是为什么我们可以在此处应用textDecoration规则的原因.

Use inline style textDecoration: 'none' for the link. <Link> gets rendered as a standard <a> tag, which is why we can apply textDecoration rule there.

<Drawer width={200} open={this.state.drawerOpen} docked={false} onRequestChange={this.toggleDrawer}>
   <Link to="/businesspartners" style={{ textDecoration: 'none' }}>
      <MenuItem onTouchTap={this.toggleDrawer.bind(this, false)}
                rightIcon={<CommunicationBusiness />}
      >
         Business Partners
      </MenuItem>
   </Link>
</Drawer>

这篇关于材质ui抽屉中的渲染链接的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！