Удалить действие из пустой строки v-data-table Vuetify

Question

Я пытаюсь сделать свою v-data-таблицу на статической высоте, поэтому я решил добавить пустые строки. После того, как я добавил действие, которое удаляет строку, и теперь у меня есть значки на пустых строках. Как я могу удалить их? Вы можете увидеть изображение того, что я имею в виду здесь

<template v-slot:item.action="{ item }">
      <v-icon
        small
        @click="deleteItem(item)"
      >
        mdi-delete
      </v-icon>
    </template>

Полный код компонента на codepen

Answer 1

Проверьте, есть ли у item свойство (например, name), поскольку ваш defaultItem является пустым объектом.

<v-icon
  v-if="item.hasOwnProperty('name')"
  ...
>...</v-icon>