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

Question

你怎么能在情感上达到这样的程度

.navBar__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);
}

Answer 1

您可以使用 Composition and String 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);
   }
`;

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

How to use :not(.className) and pseudo selector after in React using Emotion.js

emotion

reactjs