我有以下几点:

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

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

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


当前回答

你可以在你的scss文件中使用这段代码; 这将消除不需要的颜色变化,

a:-webkit-any-link {
  &:hover {
    color: white;
  }
}

其他回答

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

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

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

/ / CSS

.navigation_bar > ul > li {
      list-style: none;
      display: inline;
      margin: 2%;
    }

    .link {
      text-decoration: none;
    }

.jsx

 <div className="navigation_bar">
            <ul key="nav">
              <li>
                <Link className="link" to="/">
                  Home
                </Link>
              </li>
            </ul>
          </div>

只需将此添加到您的css文件或样式中,以删除任何导致下划线的链接!

答:-webkit-any-link{文字修饰:没有;}

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

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

一个{ 你想要什么造型 }

这很简单。只需在<Link>标签内添加style={{textDecoration: 'none'}}

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