React: !important 속성을 가진 스타일의 업데이트

발생일: 2015.06.03

키워드: React, 리액트, important

문제:
React 에서 `!important`가 포함된 스타일을 적용하려고 한다.

대략 아래와 같은 코드이다.

render() {
    var style = `{this.props.height} !important`;
    return (
        <div style={style}></div>
    );
}


헌데, 스타일 적용은 되는데, 변경된 이후에 업데이트가 되지 않는다.
왜일까?



해결책:

확인해보니, React 라이브러리에서 `!important` 를 설정하는 것까진 지원하고 있지만, 해당 속성을 업데이트하진 않고 있다고 한다.

페이스북 내에서도 이 속성을 설정할 지 말지에 대해 논쟁이 있는 것으로 보이고,
2015년 6월 현재 아직 이슈가 해결되지 않은 상태이다.


깃헙 이슈에서는 `style` 엘리먼트를 추가해서 직접 클래스를 넣는 방법으로 우회할 수 있다고도 했는데,
깔끔한 해결책이란 생각이 들진 않는다.

난 적용하려는 속성을 여러 개의 클래스로 정의해 적용하는 방식으로 우회했다.
(일반적인 경우에는 적합하지 않은 해결책이다)ti






저작자 표시 비영리 변경 금지
신고

카테고리

분류 전체보기 (659)
About me. (6)
Daylogs (624)
My works - 추억 (29)
비공개 (0)
영어공부 (0)