I was using version 3.9.0 and after upgrade to 3.11.1 the reference to $vs in Vue.prototype is not available:
# main.js
import Vue from 'vue';
import theme from '@/plugins/Theme';
Vue.use(theme);
```javascript
'use strict';
import Vuesax from 'vuesax'
import theme from '@/services/theme'
export default {
install(Vue) {
require('material-icons/iconfont/material-icons.css');
require('vuesax/dist/vuesax.css');
Vue.use(Vuesax, { theme: { colors: theme.colors } });
console.log(Vue.prototype.$vs); // undefined
}
}
I was using notifications as a plugin, and now is not available:
```javascript
# plugins/Notify.js
'use strict';
import notify from '@/services/notify'
export default {
install(Vue) {
Vue.$notify = Vue.prototype.$notify = notify.install(Vue);
}
}
```javascript
'use strict';
export default {
install(Vue) {
this.$vs = Vue.prototype.$vs; // undefined
this.$vs = Vue.$vs; // undefined
return this;
},
info(message) {
this.$vs.notify({
text: message,
iconPack: 'feather',
icon: 'icon-check-circle',
color: 'info'
})
},
success(message) {
this.$vs.notify({
text: message,
iconPack: 'feather',
icon: 'icon-check-circle',
color: 'success'
})
},
error(error) {
if (process.env.NODE_ENV !== 'production') {
console.error(error);
}
this.$vs.notify({
title: 'Error',
text: this.errorText(error),
iconPack: 'feather',
icon: 'icon-alert-circle',
color: 'danger'
})
},
errorText(error) {
if (error.response && error.response.data && error.response.data.message) {
return error.response.data.message;
}
return error.message;
}
}
```javascript
# src/views/pages/payment/update/Data.js
'use strict';
export default {
methods: {
success(data) {
this.$notify.success('OK'); // Error: $vs on notify service is undefined
}
}
}
There are any change on code about Vue.prototype.$vs usage?
Thanks!
I have a similar use case and would also like to know where I could find $vs within a custom plugin.
This is my workaround to work with notifications
export default {
install(Vue) {
Vue.mixin({
beforeCreate() {
const vm = this;
this.$notify = {
success(message, title = '') {
vm.$vs.notify({
title,
text: message,
iconPack: 'feather',
icon: 'icon-check-circle',
color: 'success',
});
},
errors(data) {
let message = data.message;
if (data.response && data.response.data) {
if (data.response.data.errors) {
const messages = [];
Object.keys(data.response.data.errors).forEach((key) => {
messages.push(...data.response.data.errors[key]);
});
message = messages.join("<br>");
} else if (data.response.data.message) {
message = data.response.data.message;
}
}
vm.$vs.notify({
title: 'Error',
text: message,
iconPack: 'feather',
icon: 'icon-alert-circle',
color: 'danger',
});
},
};
}
});
}
};
Any official solution? I'm having problems when I create a mixin file and I try to call the function to close the load. Is not working. But to load is normal.
Most helpful comment
This is my workaround to work with notifications