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

지민·2022년 11월 28일

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

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

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

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

0개의 댓글