Warning: validateDOMNesting(...): <th> cannot appear as a child of <thead>

Warning: validateDOMNesting(...): <th> cannot appear as a child of <thead>

というエラーがでたので解決した方法をここに綴ります。

翻訳

< th >は< thead >の子要素として使用できません。

問題のコード

html

<table>
  <thead>
    <th>タイトル１</th>
    <th>タイトル２</th>
  </thead>
  <tbody>
    <tr>
      <td>内容１</td>
      <td>内容２</td>
    </tr>
  </tbody>
</table>

解決方法

html

<table>
  <thead>
+    <tr>
      <th>タイトル１</th>
      <th>タイトル２</th>
+    </tr>
  </thead>
  <tbody>
    <tr>
      <td>内容１</td>
      <td>内容２</td>
    </tr>
  </tbody>
</table>

warningが出ているから画面が表示されないわけではないですが、するに越したことはないです。