내 부모 컨테이너의 조건부 클래스 이름에 반응

코알라 7

다음과 같은 경우가 있습니다

return (
    <section {...getRootProps({className: 'MuiFileDropArea-dashed'})}>
        My content
    </section>

나는에 조건문을 넣을 단면 선files.length > 0(가) className됩니다MuiFileDropArea-Nodashed

내가 어떻게 해?

기술적으로

이를 수행하기 위해 필요한 것은 백틱이있는 삼항 연산자입니다. 다른 방법이 있지만 이것은 나중에 코드를 볼 때 대부분의 사람들이 가장 쉽고 / 간단하게 읽을 수있는 방법입니다.

return (
    <section {...getRootProps({className: `MuiFileDropArea-${files.length > 0 ? 'Nodashed' : 'dashed'}`})}>
        My content
    </section>

대안은 다음과 같습니다.

return (
    <section {...getRootProps({className: files.length > 0 ? 'MuiFileDropArea-Nodashed' : 'MuiFileDropArea-dashed'})}>
        My content
    </section>

이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.

침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제

에서 수정
0

몇 마디 만하겠습니다

0리뷰
로그인참여 후 검토

관련 기사

분류에서Dev

컨테이너 클래스에 대한 조건부 정의 방법

분류에서Dev

조부모에게 절대 위치하는 정적 컨테이너 내부의 CSS 클리핑 이미지

분류에서Dev

클래스 내부의 파이썬 모의 반복기 함수

분류에서Dev

dplyr 내부의 조건부 케이스

분류에서Dev

내 컨테이너 내부의 모든 행에 대해 부트 스트랩 클래스가로드되지 않습니다.

분류에서Dev

컨테이너 부트 스트랩 캐 러셀의 반응 형 이미지

분류에서Dev

호스트에서 컨테이너 내부의 크론 작업

분류에서Dev

ECS Docker 컨테이너 내부의 AWS 태그에 액세스

분류에서Dev

테이블 셀 디스플레이 컨테이너 내부의 최대 너비 (%)

분류에서Dev

Docker 컨테이너 (Ubuntu) 내부의 IPSEC VPN 클라이언트

분류에서Dev

종속성 주입을 위해 클래스 내부에 컨테이너를 정의해야합니까?

분류에서Dev

Bootstrap의 컨테이너 클래스를 사용하여 div 내부 중앙에 열을 만드는 방법

분류에서Dev

그것의 부모로부터 정적 컨텍스트 내에서 테스트 클래스의 이름을 돌려

분류에서Dev

Less의 하위 클래스 내에서 조부모에게 조건을 적용하는 방법

분류에서Dev

std :: vector 컨테이너 내부의 데이터 액세스

분류에서Dev

컨테이너 내부의 모든 버튼에 onClickListener 연결

분류에서Dev

클릭 할 수없는 컨테이너 내부의 ios tableview

분류에서Dev

컨테이너 내에서 두 개의 독립적 인 클래스의 부모 / 파생 관계를 적용하는 방법은 무엇입니까?

분류에서Dev

반응 형 탭 내부의 부트 스트랩 반응 형 테이블

분류에서Dev

클릭 이벤트가있는 컨테이너 내부의 체크 박스

분류에서Dev

ExtJs 컨테이너 내부의 SVG

분류에서Dev

mySQL의 클래스 테이블 상속의 조건부 조인

분류에서Dev

localhost의 다른 컨테이너 내부 컨테이너에서 Docker 포트에 액세스

분류에서Dev

CSS : 컨테이너 내부의 버튼 텍스트 정렬

분류에서Dev

Flutter : 컨테이너 내부의 수직 스크롤

분류에서Dev

컨테이너 내부의 텍스트 정렬

분류에서Dev

컨테이너 내부의 텍스트 배치

분류에서Dev

컨테이너 내부의 세로 스크롤 가능 div

분류에서Dev

다른 컨테이너 내부의 Python 클라이언트에서 컨테이너 내부 서비스를 호출 할 때 연결 오류

Related 관련 기사

  1. 1

    컨테이너 클래스에 대한 조건부 정의 방법

  2. 2

    조부모에게 절대 위치하는 정적 컨테이너 내부의 CSS 클리핑 이미지

  3. 3

    클래스 내부의 파이썬 모의 반복기 함수

  4. 4

    dplyr 내부의 조건부 케이스

  5. 5

    내 컨테이너 내부의 모든 행에 대해 부트 스트랩 클래스가로드되지 않습니다.

  6. 6

    컨테이너 부트 스트랩 캐 러셀의 반응 형 이미지

  7. 7

    호스트에서 컨테이너 내부의 크론 작업

  8. 8

    ECS Docker 컨테이너 내부의 AWS 태그에 액세스

  9. 9

    테이블 셀 디스플레이 컨테이너 내부의 최대 너비 (%)

  10. 10

    Docker 컨테이너 (Ubuntu) 내부의 IPSEC VPN 클라이언트

  11. 11

    종속성 주입을 위해 클래스 내부에 컨테이너를 정의해야합니까?

  12. 12

    Bootstrap의 컨테이너 클래스를 사용하여 div 내부 중앙에 열을 만드는 방법

  13. 13

    그것의 부모로부터 정적 컨텍스트 내에서 테스트 클래스의 이름을 돌려

  14. 14

    Less의 하위 클래스 내에서 조부모에게 조건을 적용하는 방법

  15. 15

    std :: vector 컨테이너 내부의 데이터 액세스

  16. 16

    컨테이너 내부의 모든 버튼에 onClickListener 연결

  17. 17

    클릭 할 수없는 컨테이너 내부의 ios tableview

  18. 18

    컨테이너 내에서 두 개의 독립적 인 클래스의 부모 / 파생 관계를 적용하는 방법은 무엇입니까?

  19. 19

    반응 형 탭 내부의 부트 스트랩 반응 형 테이블

  20. 20

    클릭 이벤트가있는 컨테이너 내부의 체크 박스

  21. 21

    ExtJs 컨테이너 내부의 SVG

  22. 22

    mySQL의 클래스 테이블 상속의 조건부 조인

  23. 23

    localhost의 다른 컨테이너 내부 컨테이너에서 Docker 포트에 액세스

  24. 24

    CSS : 컨테이너 내부의 버튼 텍스트 정렬

  25. 25

    Flutter : 컨테이너 내부의 수직 스크롤

  26. 26

    컨테이너 내부의 텍스트 정렬

  27. 27

    컨테이너 내부의 텍스트 배치

  28. 28

    컨테이너 내부의 세로 스크롤 가능 div

  29. 29

    다른 컨테이너 내부의 Python 클라이언트에서 컨테이너 내부 서비스를 호출 할 때 연결 오류

뜨겁다태그

보관