如何摆脱React路由器的链接组件的下划线?

我有以下几点:

如何去掉蓝色下划线? 代码如下:

<Link to="first"><MenuItem style={{paddingLeft: 13, textDecoration: 'none'}}> Team 1 </MenuItem></Link>

MenuItem组件来自http://www.material-ui.com/#/components/menu

当前回答

我认为在菜单项(和其他MaterialUI组件，如按钮)中使用react-router-dom链接的最好方法是在“组件”道具中传递链接

<Menu>
   <MenuItem component={Link} to={'/first'}>Team 1</MenuItem>
   <MenuItem component={Link} to={'/second'}>Team 2</MenuItem>
</Menu>

你需要在“MenuItem”的“to”道具中传递路由路径(它将被传递给Link组件)。这样你就不需要添加任何样式，因为它将使用MenuItem样式

其他回答

 a {
  text-decoration: none !important;
  color: black !important; 
  font-size: 20px;
}

在App.css中使用

jsx:

<Link className="link">
  test
</Link>

css:

.link{
    text-decoration: none;
}

我只是加了两行，就为我工作了:)

{
 text-decoration: none; 
 color: black;
}

a:-webkit-any-link {
  text-decoration: none;
  color: inherit;
}

标准的a-link和react-link是一样的。

如果你要样式化a-link，它会自动样式化react-link。

一个{ 你想要什么造型｝

推荐文章