样式化组件内的伪类选择器

Question

我在一些非常简单的事情上有点受阻。我尝试在样式化的组件中添加一个伪类选择器。仅在悬停时为链接元素添加一些背景但他似乎不认识这个伪类，因为里面的css没有被应用如果有人能帮我弄清楚为什么没有，那将是救命稻草哈哈

下方的代码

import React from "react";
import styled from "styled-components";
import { Link } from "react-router-dom";
import { config } from "../../configFile";
import { StyledTitle, StyledSpan, StyledBasicLink } from "../../utils/style/Styled";
const Button = styled(Link)`
display: flex;
justify-content: center;
padding: 10px 15px;
color: #f7f7f7;
text-decoration: none;
font-size: 18px;
text-align: center;
align-items: center;
&:hover {
background-color: darken(#000000, 5%);
border-radius: 5px;
}
`

Answer 1

我认为这样做的一种方法是向控件添加一个事件处理程序，这样当发生悬停/mouseOver时，它会向组件添加一个css类来更改背景颜色和边框半径。