[ASK] How to call notify from js files

[christhofer]

From the readme, to show the notification we can use

this.$notify({
  message: 'Welcome',
  type: 'success'
})

how to do this in .js files? e.g I have api.js and when the API call returns error, I want to show the notification. Tried these but it doesn't work

import Vue from 'vue'
// some API call
Vue.prototype.$notify({message: 'some error', type: 'danger'})
/* Cannot read property 'notify' of undefined */

import Vue from 'vue'
import Notify from 'vue-notifyjs'
import '@/assets/css/themify-icons.css'
import 'vue-notifyjs/themes/default.css'

// some API call
Notify({message: 'some error', type: 'danger'})
/* vue_notifyjs__WEBPACK_IMPORTED_MODULE_2___default(...) is not a function */

Also I'm thinking of putting the initialization in a single js file (notification.js), which then imported to main.js

import Vue from 'vue'

import Notify from 'vue-notifyjs'
import '@/assets/css/themify-icons.css'
import 'vue-notifyjs/themes/default.css'

Vue.use(Notify, {
	timeout         : 3000,
	verticalAlign   : 'bottom',
	horizontalAlign : 'right',
})

Vue.prototype.$notif = {
	success: (message, title = 'Success') => {
		Notify({
			message,
			title,
			type : 'success',
			icon : 'fas fa-check-circle fa-fw',
		})
	},
	error: (message, title = 'Error') => {
		Notify({
			message,
			title,
			type : 'danger',
			icon : 'fas fa-times-circle fa-fw',
		})
	},
	warning: (message, title = 'Warning') => {
		Notify({
			message,
			title,
			type : 'warning',
			icon : 'fas fa-exclamation-circle fa-fw',
		})
	},
	info: (message, title = 'Info') => {
		Notify({
			message,
			title,
			type : 'info',
			icon : 'fas fa-info-circle fa-fw',
		})
	},
}

export default {}

So that in the template I can just call this.$notif.success("message")

or in the Vuex modules / api.js Vue.prototype.$notif.error(error.response.data)