如何自定义单个表格标题-vue 2-vuetify?

k97glaaz  于 2022-11-30  发布在  Vue.js
关注(0)|答案(1)|浏览(144)

我读过这样的回答:How can you customize all elements in a table header?
但这是关于所有的标题,我只需要添加图标到第一个标题
我试着调整所有的标题,但它看起来很奇怪,不干净。

inkz8wg9

inkz8wg91#

您可以在Vuetify文档中找到答案,但也可以在您所读问题的answer中找到答案。

<v-data-table
  :headers="headers"
  :items="items"
>
  <template v-slot:header.HEADER_VALUE="{ header }">
    <!-- ICON HERE -->
  </template>
</v-data-table>

您所要做的就是将HEADER_VALUE更改为第一个标头值属性,然后在模板中,您只需放置HTML来显示您的图标(我猜您肯定会使用v-icon),它应该可以解决您的问题。
祝您的项目好运!

相关问题