vuetify-vuejs-messagedialog

Vuetify VueJS message dialog Component with Promise support

Installation

npm install vuetify-vuejs-messagedialog --save

Quick Promise Usage

this.$vuetifyMessageDialog.open("Example Title", "Example Content", "OK", "green").then(state => {
  console.log(state);
});

Detailed Promise Usage

Enable the plugin in your Project

<script>
  import Vue from 'vue';
  import messageDialog from 'vuetify-vuejs-messagedialog';
  Vue.use(messageDialog);

  // …
</script>

Use the plugin in any Vue file :

<template>
…
</template>

<script>
export default{
  name: "…",
  // …
  methods: {
    sample: function(){
      this.$vuetifyMessageDialog.open("Example Title", "Example Content", "OK", "green").then(state => {
        console.log(state);
      });
    }
  }
}
</script>

Component Usage

<template>
  <messageDialog
    v-model="showConfirm"
    title="Oh Snap !"
    text="Sorry but, an error as occured…"
    closeText="Close"
    closeColor="red"
    v-on:closeAction="() => this.showConfirm = false"
  />
</template>

<script>
  import Vue from 'vue';
  import messageDialog from 'vuetify-vuejs-messagedialog';
  Vue.use(messageDialog);

  export default {
    name: 'example',
    data(){
      return {
        "showConfirm": true
      }
    }
  }
</script>