[Next.js] 테이블코딩시 hydration error 해결법

지민·2022년 11월 28일
1

저는 이거 제가 코딩 이상하게 해서 그런건줄 알았는데 사실 그게 아니고 일단 하이드레이션 자체가 처음 렌더링된 DOM이랑 나중에 재랜더링된 DOM이 달라서 그런건데 테이블같은 경우는 우리가 잘 모르지만

table
	thead
    	tr
          th
          th
       	tr
    thead
	tbody
    	tr
        	td
            td
        tr
    tbody
table

대충 일케 생겼어요 근데 우리가 thead, tbody이런걸 안적어주면 브라우저가 똑똑해서 알아서 넣어줍니다 하지만 브라우저가 우리가 쓴 코드에 뭔갈 더 넣게되면 처음 렌더링, 재렌더링 이거 2개 DOM이 다르게 생겼겠죠?? 그래서 하이드레이션 뜨는거에여 ㅎㅎ

profile
남들 개발 공부할 때 일기 쓰는 사람

0개의 댓글