reactjs - 来自 React-router-dom 的样式组件，不适用于样式组件

Question

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


const StyledLink = styled(Link)`
  text-decoration: none;
  cursor: pointer;
  color: black;
  font-size: 14px;
  line-height: 22px;
  font-weight: 60";
  color: #393e46;
  letter-spacing: .01em;
`;


const App = () => {
 return <StyledLink>some text</StyledLink>
}

export default App;

我正在尝试使用 Styled components 语法从 react-router-dom 设置 Link 组件的样式，但它破坏了我的整个应用程序并且它不能按预期工作。

标签： reactjsreact-routerstyled-components

Answer 1

在 Link 组件里面，有一个a标签，你需要给她设置样式：

styled(Link)`
 a {
   your style here
 }
`