css 如何在脉轮UI中使用这个伪a::hover::after?

bmp9r5qi  于 2022-11-19  发布在  其他
关注(0)|答案(1)|浏览(137)

我正在尝试一些需要使用伪a::hover::after的css样式,我假设如文档中所述,我可以这样做来使用hover伪:

<Link _hover={{//styles here}}/>

在同样的意义上使用hover::after应该是这样的:

<Link _hover_after={{//styles here}}/>

但是它似乎不起作用,而且我在文档中找不到关于这个特殊用法的线索。我如何在带有脉轮UI的React元素上使用伪::hover::after

zsbz8rwp

zsbz8rwp1#

我以前遇到过这个问题,但我找不到解决方案。但我使用isHovering状态做了一个变通方案,当onMouseOver事件将其设置为true,而onMouseLeave事件将其设置为false,并添加条件样式。请参见示例:

const LinkElement = () => {
    const [isHovering, setIsHovering] = useState(false);

    return <Link 
                _after={ color: isHovering ? 'red' : 'blue' } 
                onMouseEnter={() => setIsHovering(true)}
                onMouseLeave={() => setIsHovering(false)}
            />
}

相关问题