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

我有以下几点:

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

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

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

当前回答

jsx:

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

css:

.link{
    text-decoration: none;
}

其他回答

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

我有一个问题，链接元素将我的h4更改为“下划线”，设置文本装饰:“none”不起作用，我唯一的解决方案是使用按钮。

<Link to="/settings">
    <button>Settings</button>
</Link>

<Link
   to='/maxpain'
   replace
   style={{
           textDecoration: 'none'
          }}
   >
     <LinkText>Click here!</LinkText>
</Link>

就这么简单!

我看到你在使用内联样式。textDecoration: 'none'在child中使用，实际上它应该在<Link>中使用，如下所示:

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

<Link>将返回一个标准的<a>标签，这就是为什么我们在这里应用textDecoration规则的原因。

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

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

推荐文章