Skip to content

<VueFormDelete>

Renders a delete button that calls the delete method on click. The button is automatically visible only in update mode.

vue
<template>
  <VueForm>
    <template #default="{...}">
      <VueFormDelete v-slot="{ deleteItem, isDeleting, isReading, isLoading }">
        <button @click="confirmDelete(deleteItem)" :disabled="isDeleting">
          {{ isDeleting ? "Deleting..." : "Delete" }}
        </button>
      </VueFormDelete>
    </template>
  </VueForm>
</template>

<script setup>
function confirmDelete(deleteItem) {
  if (confirm("Are you sure?")) {
    deleteItem();
  }
}
</script>

Slots

default

Slot Props

NameDescription
deleteItemFunction
Wrapper for calling delete method
isDeletingBoolean
Check the context object docs
isReadingBoolean
Check the context object docs
isLoadingBoolean
Check the context object docs

Version 1.0.0