9.3.1 classnames

    classnames는 CSS 클래스를 조건부로 설정할 때 매우 유용한 라이브러리입니다. 또한, CSS Module을 사용할 때 이 라이브러리를 사용하면 여러 클래스를 적용할 때 매우 편리합니다.

    우선 해당 라이브러리를 설치하세요.

    $ yarn add classnames

    classnames의 기본적인 사용법을 한번 훑어 봅시다.

    classnames 간략 사용법

    import classNames from 'classnames';
     
    classNames('one', 'two'); // = 'one two'
    classNames('one', { two: true }); // = 'one two'
    classNames('one', { two: false }); // = 'one'
    classNames('one', ['two', 'three']); // = 'one two three'
     
    const myClass = 'hello';
    classNames('one', myClass, { myCondition: true }); // = 'one hello myCondition'

    신간 소식 구독하기
    뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.