样式组件内的伪类选择器

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

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