在React中使用Emotion.js后如何使用:not.className和伪选择器

问题描述

如何在情感上实现这样的目标

@H_404[email protected]__Link:not(.noborder)::after{
    content: '';
    position: absolute;
    top: 50%;
    left: 10px;
    height: 15px;
    width: 0;
    z-index:-1;
    
    background-color: var(--colorPrimary);
    transition: all .3s cubic-bezier(0.25,0.46,0.45,0.94);
}

解决方法

您可以使用CompositionString Styles来实现。请参阅文档。

  css`
   &:not(.noborder)::after navBar__Link {
     content: '';
     position: absolute;
     top: 50%;
     left: 10px;
     height: 15px;
     width: 0;
     z-index:-1;
    
     background-color: var(--colorPrimary);
     transition: all .3s cubic-bezier(0.25,0.46,0.45,0.94);
   }
`;