2017-05-04 6 views
1

나는 반응을 보이고 일부 아이콘의 스타일을 지정하고 있습니다. 내 구성 요소에 Material-UI 라이브러리를 사용하고 있습니다. 내가 사용하는 구성 요소 중 하나는 FontIcon입니다. 이미 클래스 이름이 있고, 아프로디테 스타일로 전달할 수 없습니다. 나는이 컨트롤에 스타일을 설정하면material-ui className을 아프로디테로 덮어 쓰려면 어떻게해야합니까?

<FontIcon className="material-icons"> 
    bug_report 
</FontIcon> 

, 그것은 잘 작동 :

<FontIcon className="material-icons" style={{ color: 'red' }}> 
    bug_report 
</FontIcon> 

어떻게 기존 클래스 이름을 덮어 쓸 수 있습니다? 나는 시도했다 :

className={css(['material-icons', styles.colorize])} 
className={css('material-icons', styles.colorize)} 
className={('material-icons', css(styles.colorize))} 

고마워!

답변

1

이 구성 요소는 사용자 정의 className 속성을 전달할 수 없으며 PropTypes definition에서 볼 수있는 것처럼 style으로 확장하는 기능 만 제공합니다.

Material-ui는 JS 형식의 스타일을 사용하고 있으며, 때때로 "보통"CSS를 다루고 싶지 않습니다.

사용자 정의 className의 div에 구성 요소를 래핑하고 대신 양식을 지정할 수 있습니다. Appart가 요청을 풀 때 많은 선택의 여지가 없습니다.

+0

포장이 작동하지 않는 것 같습니다. 그들 모두를 이길 수 없다 :) –

+0

div에있는 아이콘을 감싸고 div에'className'을주고'.yourclass> span'을 사용하여 스타일을 지정하는 것과 같은 것을 말하면 '! important';와 작동해야한다;) –

관련 문제