코드캠프 팀프로젝트 4주차 - Warning: validateDOMNesting(...): <div> cannot appear as a descendant of <p>.

은채·2022년 7월 28일
0

team-project

목록 보기
26/28
post-thumbnail
post-custom-banner

코드 자체가 동작하지 않는 에러는 아니지만 콘솔창을 물들인 한 에러
메모리 누수 탐지를 위해 돌아다니던 중 발견한 커뮤니티 메뉴의 에러다.
내 담당 파트는 아니지만, 혹시라도 배포에 문제가 될까바 에러를 잡고 있는 중이기 때문에 내가 바로 해결하려고 한다. 생각없이 태그를 작성하다보면 발생할 수 있는 문제인 것 같다.

<div> cannot appear as a descendant of <p>

div 요소는 p 태그의 자식 태그로 들어갈 수 없다는 말이다.
p 는 인라인 요소이고, div 는 블록 요소이므로 인라인 요소 안에 블록 요소가 들어가 있기 때문에 발생한 에러이다.

BoardContents가 p 태그인데, 그 안에 div태그가 들어있다.
이 부분은 toast ui를 통해 작성한 내용이 보여지는 부분인 것 같다.

boardContents의 속성을 div로 바꾸고나니 바로 사라졌다.

profile
반반무마니
post-custom-banner

0개의 댓글