CODEWITHSUNDEEP
vue.jsvuetify.js
geschema
geschema

Reputation: 2494

Vuetify data table: add insert row icon

I'm looking for a way to add a dynamic "Insert Row" icon to a Vuetify data-table, similar to the screenshot below:

enter image description here

Any suggestions on how to implement this?

Upvotes: 2

Views: 781

Answers (1)

Guillaume Duhan
Guillaume Duhan

Reputation: 252

Use template to insert a div that reveals only on hover with a sidebutton on absolute:

<v-data-table>
  <template #item="{ item }">
    <div class="myBorderBottomBlueClass"> // only reveal on hover
      // my icon in absolute position left with @click
    </div>
  </template>
</v-data-table>

Upvotes: 0

Related Questions