Alertify js vue

import Vue from 'vue';
import VueAlertify from 'vue-alertify';
 
Vue.use(VueAlertify);
 
var vm = new Vue({
  el: '#main',
  methods: {
    success: function() {
      this.$alertify.success('success');
    },
    alert: function() {
      this.$alertify.alert('This is alert', () =>
        this.$alertify.warning('alert is closed')
      );
    },
    alertWithTitle: function() {
      this.$alertify.alert('alert title', 'This is alert', () =>
        this.$alertify.warning('alert is closed')
      );
    },
    confirm: function() {
      this.$alertify.confirm(
        'This is comfirm',
        () => this.$alertify.success('ok'),
        () => this.$alertify.error('cancel')
      );
    },
    confirmWithTitle: function() {
      this.$alertify.confirm(
        'confirm title',
        'This is comfirm',
        () => this.$alertify.success('ok'),
        () => this.$alertify.error('cancel')
      );
    },
    prompt: function() {
      this.$alertify.prompt(
        'This is prompt',
        'default value',
        (evt, value) => this.$alertify.success('ok: ' + value),
        () => this.$alertify.error('cancel')
      );
    },
    promptWithTitle: function() {
      this.$alertify.promptWithTitle(
        'prompt title',
        'This is prompt',
        'default value',
        (evt, value) => this.$alertify.success('ok: ' + value),
        () => this.$alertify.error('cancel')
      );
    },
    promptWithTypeColor: function() {
      this.$alertify
        .promptWithTitle(
          'prompt title',
          'This is prompt',
          'default value',
          (evt, value) => this.$alertify.success('ok: ' + value),
          () => this.$alertify.error('cancel')
        )
        .set('type', 'color');
    },
  },
  mounted: function() {
    setTimeout(() => {
      this.$alertify.success('Hell Alertify');
    }, 500);
  },
});

Source: npmjs.com

Alertify js vue

Vue.use(VueAlertify, {
  // dialogs defaults
  autoReset: true,
  basic: false,
  closable: true,
  closableByDimmer: true,
  frameless: false,
  maintainFocus: true, // <== global default not per instance, applies to all dialogs
  maximizable: true,
  modal: true,
  movable: true,
  moveBounded: false,
  overflow: true,
  padding: true,
  pinnable: true,
  pinned: true,
  preventBodyShift: false, // <== global default not per instance, applies to all dialogs
  resizable: true,
  startMaximized: false,
  transition: 'pulse',
 
  // notifier defaults
  notifier: {
    // auto-dismiss wait time (in seconds)
    delay: 5,
    // default position
    position: 'top-right',
    // adds a close button to notifier messages
    closeButton: false,
  },
 
  // language resources
  glossary: {
    // dialogs default title
    title: 'AlertifyJS',
    // ok button text
    ok: 'OK',
    // cancel button text
    cancel: 'Cancel',
  },
 
  // theme settings
  theme: {
    // class name attached to prompt dialog input textbox.
    input: 'ajs-input',
    // class name attached to ok button
    ok: 'ajs-ok',
    // class name attached to cancel button
    cancel: 'ajs-cancel',
  },
});

Source: npmjs.com

Similar codes

1 vote300 views2 answers
Add remove to array vue js
Javascript Vue
0 vote314 views1 answer
Vuejs localstorage add value
Javascript Vue
0 vote415 views1 answer
Vue router transition
Javascript Vue
0 vote319 views1 answer
Firestorage vuetify
Javascript Vue
18 votes410 views6 answers
Vue js cdn
Javascript Vue
0 vote318 views1 answer
How to run method in method vue js on load
Javascript Vue
1 vote297 views1 answer
Vuetify sass variables
Javascript Vue
1 vote330 views1 answer
Vue select option get attribute
Javascript Vue
0 vote301 views1 answer
You are using the runtime-only build of Vue where the template compiler is not available. Either pre-compile the templates into render functions, or use the compiler-included build.
Javascript Vue
1 vote310 views1 answer
How to detect props change in vue
Javascript Vue