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

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

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

就这么简单!

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

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

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

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

CSS解决方案也用于React

只在Link(React Router)标签中添加className/class。(最重要的部分!!在链接标签中添加ClassName，而不是其他标签。) 在css文件中添加text-decoration: none。

Nav.js

  <Link to="/" className="link" >
    Get Started
  </Link>

Nav.css

.link{
text-decoration: none;
}

如果你正在使用样式化组件，你可以这样做:

import React, { Component } from 'react';
import { Link } from 'react-router-dom';
import styled from 'styled-components';


const StyledLink = styled(Link)`
    text-decoration: none;

    &:focus, &:hover, &:visited, &:link, &:active {
        text-decoration: none;
    }
`;

export default (props) => <StyledLink {...props} />;