Vue 数据表标题都出现在一列中

问题描述

我有一个 v-data-table 并且我正在尝试打印我的标题，但是使用我的代码，它们都出现在一个列中，而不是整个表格中。

<template v-slot:header>
    <thead>
        <tr>
            <div v-for="(itm,i) in hdrs" :key="i">
              <th>
                {{itm.value}}
              </th>
            </div>
        </tr>
    </thead>
</template>

有人可以就如何解决此问题提供建议吗？

解决方法

应该在 th 元素中完成循环并删除第一个 div :

<tr>
  <tempalte v-for="(itm,i) in hdrs">
     <th v-if="someCondition">
      {{itm.value}}
     </th>
  </template>
</tr>