인프런 커뮤니티 질문&답변

웹개발자님의 프로필 이미지

작성한 질문수

[리뉴얼] React로 NodeBird SNS 만들기

댓글 구현하기

css custom

해결된 질문

20.10.16 19:06 작성

·

131

0

안녕하세요 제로초님 css 관련 궁금한 점이 있어서 질문남깁니다!

아래와 같은 코드에서 리액트가 상태를 파악해서 다시 그려주는데 만약 open상태에서 그 어떤 글자를 클릭했을 때 색을 변하게 하고 싶어서 함수로 직접 dom에접근해 style을 변경시켰는데 다시 닫았다가 다시 open일 때 태그에 넣어놨던 style이 사라지는 경우 가 있습니다. 클래스도 마찬가지구요. 그러할 경우에는 기존 아래와 같은 방식으로는 해결할 수 없나요?

답변 1

0

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

2020. 10. 16. 22:10

리액트에서는 진짜 특수한 경우를 제외하고 직접 DOM에 접근하시면 안 됩니다. 리렌더링될 때 DOM에 직접 변경했던 내용이 전부 초기화됩니다. item.content같은 데이터를 수정하셔야 합니다. content에는 리액트 컴포넌트를 넣을 수 있습니다. 글자를 클릭할 때 그 글자의 색이 바뀌는 컴포넌트를 item.content 데이터와 함께 넣으시면 됩니다.

content={<ChangeColorComment data={item.content} />}