vue <td>标签中不能使用v-for中的数据

Question

<th v-for="(person,index) in people">
        <td>
            {{person}}
        </td> 
        <td class="text-center">
            <button v-on:click="deleteItem(index)">delete</button>
        </td>
 </th>
</tr>

为什么把td标签换成其它比如div后，就可以了，否则报下面这个错误： Property or method "person" is not defined on the instance but referenced during render. Make sure to declare reactive data properties in the data option.
求vue大神指点

Answer 1

你th里面放td是什么诡异的使用方法。。。

Answer 2

目测是因为th里面不能嵌套td的原因

        <tr v-for="(person,index) in people">
            <td>
                {{person}}
            </td> 
            <td class="text-center">
                <button v-on:click="deleteItem(index)">delete</button>
            </td>
        </tr>

这样即可

Answer 3

在tr里放td

<tr>
  <td></td>
</tr>

Answer 4

table(thead(th) tbody(tr(td)))

表格的树状结构大概是这样的，td应该放在tr中，而不是th中。