Блог

Главная - Вопросы по программированию - Как использовать: not(.className) и псевдоселектор после использования в React Emotion.js

Как использовать: not(.className) и псевдоселектор после использования в React Emotion.js

#reactjs #emotion

#reactjs #эмоции

Вопрос:

как вы можете добиться чего-то подобного в emotion

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

Комментарии:

1. amp;:not(.noborder)::after … В области ваших компонентов

2. @DennisVash это на самом деле то, что я искал по компоненту scoop вы имеете в виду компонент, который будет иметь navBar__Link в качестве имени класса, верно?

Ответ №1:

Для достижения этой цели вы можете использовать стили композиции и строки. пожалуйста, обратитесь к документации.

   css`
   amp;: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);
   }
`;

Комментарии:

1. спасибо, это ответ xlear, а что, если бы у меня было что-то вроде этого: const navBarLink = app some style , так что теперь navBar__Link больше не является классом, как переписать ваш ответ