我有以下几点:
如何去掉蓝色下划线? 代码如下:
<Link to="first"><MenuItem style={{paddingLeft: 13, textDecoration: 'none'}}> Team 1 </MenuItem></Link>
MenuItem组件来自http://www.material-ui.com/#/components/menu
我有以下几点:
如何去掉蓝色下划线? 代码如下:
<Link to="first"><MenuItem style={{paddingLeft: 13, textDecoration: 'none'}}> Team 1 </MenuItem></Link>
MenuItem组件来自http://www.material-ui.com/#/components/menu
当前回答
我只是加了两行,就为我工作了:)
{
text-decoration: none;
color: black;
}
其他回答
这很简单。只需在<Link>标签内添加style={{textDecoration: 'none'}}
<Link to="first" style={{ textDecoration: 'none' }}>
<MenuItem style={{ paddingLeft: 13 }}>
Team 1
</MenuItem>
我认为在菜单项(和其他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样式
jsx:
<Link className="link">
test
</Link>
css:
.link{
text-decoration: none;
}
你可以在Link组件中添加style={{textDecoration: 'none'}}来删除下划线。你也可以在样式块中添加更多的css,例如style={{textDecoration: 'none', color: 'white'}}。
<h1>
<Link style={{ textDecoration: 'none', color: 'white' }} to="/getting-started">
Get Started
</Link>
</h1>
/ / 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>