Lightweight Toast Notification Plugin For Vue 3 - dk-toast

Install & Download:

# NPM
$ npm i vue-dk-toast --save--save

Description:

dk-toast is a lightweight yet fully customizable toast notification plugin for Vue 3 apps.

How to use it:

1. Import the dk-toast.

import { createApp } from 'vue';
import App from './App.vue';
import DKToast from 'vue-dk-toast';
createApp(App).use(DKToast).mount('#app');

2. Display a basic toast notification on the app.

this.$toast('Hello World!');

3. Config the toast notification with the following options.

this.$toast('Hello World!', {
  duration: 5000,
  styles: {
    // CSS styles here
  },
  link: { // turns the toast into an <a> element which has a href of the one provided and optional target="_blank".
    href: '',
    targetBlank: true
  },
  // Any valid HTML, intended for icons
  slotLeft: '', 
  slotRight: '', 
  class: '',
  type: 'success', // 'success', 'error' and 'passive'
  positionX: 'center',
  positionY: 'top',
  disableClick: true
})