vuetify-vuejs-confirmdialog
Vuetify VueJS confirmation dialog Component with Promise support.
Installation
npm install vuetify-vuejs-confirmdialog --save
Usage with Vuetify-Loader (aka a-la-carte)
Recently the Vuetify plugin for vue-cli enable A-la-carte by default.
Importing every components
Since Vuetify-Loader didn't « scan » correctly usage in external dependencies you have to manually import components needed…
;;;; Vue;Vue;
Quick Promise Usage
this$vuetifyConfirmDialog ;
Detailed Promise Usage
Enable the plugin in your Project
;;Vue; // …
Use the plugin in any Vue file :
<template>…</template> <script>export default { name: "…", // … methods: { sample: function() { this.$vuetifyConfirmDialog .open("Example Title", "Are you sure ?", "Cancel", "Confirm", "red", "green") .then(state => { console.log(state); }); } }};</script>
Component Usage
<template> <confirmDialog v-model="showConfirm" title="Are you sure ?" text="Warning ! This action is irreversible" cancelText="Cancel" confirmText="Confirm" cancelColor="red" confirmColor="green" v-on:cancelAction="() => this.showConfirm = false" v-on:confirmAction="() => this.showConfirm = false" /></template> <script> import Vue from 'vue'; import confirmDialog from 'vuetify-vuejs-confirmdialog'; Vue.use(confirmDialog); export default { name: 'example' data(){ return { "showConfirm": true } } }</script>
Optional props:
cancelColor: String
confirmColor: String