Nuxt – Notification Plugin

notification.js

import Notification from '@/components/Notification'
import Vue from 'vue'

const NotificationClass = Vue.extend(Notification)

export default ({ app }, inject) => {
  inject('notification', {
    show({ ctx, title, message = '', type = 'info' }) {
      const notification = new NotificationClass({
        propsData: { title, message, type },
        parent: ctx,
      })
      notification.$mount()
      ctx.$el.appendChild(notification.$el)
      const destroy = () => {
        ctx.$el.removeChild(notification.$el)
        notification.$destroy()
      }
      notification.$on('close', () => {
        destroy()
      })
      return { destroy }
    },
    success({ ctx, title = 'Success', message = '' }) {
      return this.show({ ctx, title, message, type: 'success' })
    },
    warn({ ctx, title = 'Warning', message = '' }) {
      return this.show({ ctx, title, message, type: 'warn' })
    },
    error({ ctx, title = 'Error', message = '' }) {
      return this.show({ ctx, title, message, type: 'error' })
    },
    info({ ctx, title = 'Information', message = '' }) {
      return this.show({ ctx, title, message, type: 'info' })
    },
  })
}