찾다

 >  Q&A  >  본문

Next.js 조건부 스타일

<pre class="brush:php;toolbar:false;"><p>경로가 링크의 href와 일치하면 링크를 유효하게 만들고 싶습니다. </p> <사전><코드> 함수 Component() { const 경로명 = usePathname(); 반품 ( <div className="링크"> <Link href="/">홈페이지</Link> <Link href="/store" className={`${pathname === this.href && "active"}`} >store</Link> <Link href="/actors">배우</Link> </div> ) }</code></pre> <코드> <p>이 방법을 시도해 보았지만 안타깝게도 효과가 없었습니다. 이런 일을 할 수 있나요? </p></code></pre>
P粉596161915P粉596161915560일 전614

모든 응답(1)나는 대답할 것이다

  • P粉432930081

    P粉4329300812023-08-11 13:33:58

    클래스 컴포넌트 내에서만 접근할 수 있는 함수형 컴포넌트에서는 this를 사용할 수 없습니다. 원하는 효과를 얻으려면 코드를 수동으로 작성하면 됩니다. 예:

    으아악

    또한 className에 &&를 사용하지 않도록 주의하세요. 조건이 true가 아닌 경우 className에 false가 추가되므로 조건이 false인 경우 삼항 연산자를 사용하여 ""를 추가할 수 있습니다.

    회신하다
    0
  • 취소회신하다