react inline style 적용

doobab·2022년 12월 11일
0

태그 내에 자바스크립트 객체 형식으로 직접 넣으면 됩니다.

<div style={{display: "flex", flexDirection: "row"}} ></div>

그런데, 인라인 스타일로 넣는 것이 좋지 않다네요.
왜냐하면요!
{} === {}가 false이기 때문에, 리렌더링될 때마다 스타일 객체가 다시 계산됩니다.
인라인을 사용해야 한다면, 스타일을 변수로 설정해 사용하면 됩니다.

const styles = {display: "flex", flexDirection: "row"};
<div style={styles}></div>

출처: https://code-masterjung.tistory.com/68

profile
꾸준함을 연습하는 중🙂

0개의 댓글