[Vuejs]-How to create a function to display an alert message after deleting data

0👍

It should be something like this:

<template>
    <button class="flex items-center text-danger" @click="deleteProduct(product.id)"">
     <Trash2 class="w-4 h-4 mr-1" /> Delete
    </button>
</template>

<script setup>
function deleteProduct(productId) {
    // Logic to delete the product
    // After the deletion is completed, trigger the alert
    showAlert('Product deleted')
}

function showAlert(message) {
    // Login to show the alert with the message you receive here
}
</script>

The logic to show the modal/message/toast, should be managed inside the delete action. Those tags on the button element are not necessary.

We don’t have so much context about how your code is working, but I did my best based on what I can appreciate here.

Leave a comment