스타일이 지정된 구성 요소에 `:after` 의사 요소를 올바르게 적용하기 위한 React.js 가이드

Question

이 아름다운 밑줄 애니메이션을 발견했습니다

으아악

위 코드를 NavItem 구성 요소에 적용해야 한다는 것을 알고 있습니다. 애니메이션과 모든 것이 괜찮지만 내 NavItem 구성 요소에서는 작동하지만 전체 탐색 모음에서는 작동하지 않는 것 같습니다. NavItem CSS 및 애플리케이션 이미지

회원으로 가입한 지 몇 시간밖에 안 되어서 로컬 호스트에 사이트를 표시하는 것이 올바른 방법인지 모르겠습니다. 5월 영어도 미안해요. :)

Answer 1

css.modules를 사용하고 구성 요소에 className을 추가하는 것이 좋습니다. 먼저 매우 간단한 CSS 모듈을 만듭니다. 다음 단계를 따르세요:

• 구성 요소와 동일한 위치에 CSS 파일(name.module.css)을 만들고 CSS에 대한 논리를 만듭니다
• 구성 요소에 대해 이 모듈 가져오기:

으아악

(상수의 이름은 귀하가 선택합니다)

• 구성 요소 태그에 className 추가:

으아악

클래스에 CSS 코드가 적용되어 있는지 확인하세요.