Creating a namespaced mixin is something I am interested in achieving.
Let's use the example of a notification mixin:
(function() {
'use strict';
window.mixins = window.mixins || {}
window.mixins.notification = {
methods: {
show: function(type, message, duration) {
duration = duration || 5000;
new Noty({
type: type,
text: message,
timeout: duration,
theme: 'custom'
}).show();
}
}
}
}());
I can import it into my component and utilize it as follows:
(function() {
'use strict';
Vue.component('basic-component', function() {
mixins: [window.mixins.notification],
created: function() {
this.show();
}
})
})
However, I find it unsatisfactory since its origin may not be clear.
Is there a way to namespace the mixin so that I can do something like this:
(function() {
'use strict';
Vue.component('basic-component', function() {
mixins: [window.mixins.notification],
created: function() {
this.mixins.notification.show();
}
})
})
Edit: It seems impossible at this moment. I have raised an issue, please feel free to comment and share your thoughts on the matter: https://github.com/vuejs/vue/issues/7501