我有以下几点:

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

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

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


当前回答

为我工作,只需添加className="nav-link"和activeStyle{{textDecoration:'下划线'}}

<NavLink className="nav-link" to="/" exact activeStyle= 
  {{textDecoration:'underline'}}>My Record</NavLink>

其他回答

<Link />标签在呈现时基本上是<a>标签,所以你可以只写

a { text-decoration: none; }

这对我来说很有效:) 祝你好运

如果有人正在寻找material-ui的链接组件。只需添加属性下划线并将其设置为none

<链接下划线= "没有" >…< /链接>

我解决了一个像你这样的问题。我试着在firefox中检查元素。 我将向你们展示一些结果:

这只是我检查过的元素。“Link”组件将被转换为“a”标签,“to”道具将被转换为“href”属性:

当我点击:hov和选项:hover,这里是结果:

如你所见:悬停有文字装饰:下划线。我只添加到我的css文件:

a:hover {
 text-decoration: none;
}

问题就解决了。但我也在一些其他类(比如你:D)设置了text-decoration: none,这可能会产生一些效果(我猜)。

还有另一种方法可以正确地删除链接的样式。你必须给它的textDecoration='inherit'和color='inherit'的风格,你可以添加这些作为样式的链接标签,如:

<Link style={{ color: 'inherit', textDecoration: 'inherit'}}>

或者为了使它更通用,只需创建一个CSS类:

.text-link {
    color: inherit;
    text-decoration: inherit;
}

然后只需<Link className='text-link'>

添加css样式

a:link {
  text-decoration: none;
  color: #cc850a;
}

a:visited {
  text-decoration: none;
  color: #cc850a;
}

a:hover {
  text-decoration: none;
  color: #47a1ad;
}

a:active {
  text-decoration: none;
}