For notifications in my application, I've incorporated the euvl/vue-notification library. Each time I need to notify the user, I have to include the following code:
If I'm within a Vue component:
this.$notify({
group: 'panel',
type: 'success',
duration: 5000,
text: 'message'
})
Or if I'm working in a .js file:
Vue.notify({
group: 'panel',
type: 'success',
duration: 5000,
text: `message`
})
I wanted to simplify this process by creating a support file, similar to an event bus, where I could just use the following line to trigger a notification:
this.$notify('message')
Despite my efforts, I haven't had success with this approach so far...
main.js
import Vue from 'vue'
import App from './App.vue'
import notifications from './support/notifications'
Vue.use(notifications)
new Vue({
render: h => h(App)
}).$mount('#app')
notifications.js
import Vue from 'vue'
import Notifications from 'vue-notification'
Vue.use(Notifications)
export default function install(Vue) {
Object.defineProperty(Vue.prototype, '$notify', {
get(message) {
return Vue.notify({
group: 'panel',
type: 'success',
duration: 5000,
text: message
})
}
})
}