Warning: validateDOMNesting(...): <tr> cannot appear as a child of <table>. Add a <tbody>, <thead> or <tfoot> to your code to match the DOM tree generated by the browser. at tr at table at div at div at Information (http://localhost:3000/main.f8aa81041ea5266af521.hot-update.js:33:3) at div at App (http://localhost:3000/static/js/main.chunk.js:171:94) console. |
브라우저에는 <tbody> 태그가 필요하다. 코드에 없으면 브라우저에서 자동으로 삽입하는데, 이 것은 첫 번째 랜더링에서는 잘 동작하지만 테이블이 업데이트되면 DOM tree가 React에서 예상하는 것과 다르다. 이 경우 버그가 발생할 수 있으므로 React는 <tbody>를 삽입하라고 경고한다.
따라서 기존의 <table><tr></tr></table> 구조에 아래와 같이 <tbody> 태그를 추가하면 경고문이 사라진다.
<table>
<tbody>
<tr><td></td></tr>
</tbody>
</table>
참고 자료 :
반응형
댓글