vue-notifications
vue-notifications copied to clipboard
Usage with vue-class-component?
So I'm using vue-class-component in my project.
And I was wondering if there was a way to make it work. No luck so far. I tried doing it in two different ways.
By passing the notifications object to the decorator and then defining the method that should call it in the decorator as well:
<script>
import Vue from 'vue';
import Component from 'vue-class-component';
import VueNotifications from 'vue-notifications';
@Component({
notifications: {
copySuccess: {
title: 'Copied to clipboard!',
type: VueNotifications.types.success,
},
},
methods: {
copyNotify: function copyNotify() {
this.copySuccess();
},
},
})
export default class CodeBlock extends Vue {
copy() { // this method is bound to `@click`
this.copyNotify();
}
}
</script>
And by calling the copySuccess directly from the class method:
<script>
import Vue from 'vue';
import Component from 'vue-class-component';
import VueNotifications from 'vue-notifications';
@Component({
notifications: {
copySuccess: {
title: 'Copied to clipboard!',
type: VueNotifications.types.success,
},
},
})
export default class CodeBlock extends Vue {
copy() { // this method is bound to `@click`
this.copySuccess();
}
}
</script>
In both cases this.copySuccess is undefined.
vue-class-component has mixins support, but it requires mixins to be also defined as classes, as I understand.
This is my configuration code, just in case
import Vue from 'vue';
import VueNotifications from 'vue-notifications';
import iziToast from 'izitoast';
import 'izitoast/dist/css/iziToast.min.css';
const toast = ({ title, message, type, timeout }) => {
const checkedType = type === VueNotifications.types.warn ? 'warning' : type;
return iziToast[checkedType]({ title, message, timeout });
};
const options = {
success: toast,
error: toast,
info: toast,
warn: toast,
};
Vue.use(VueNotifications, options);
So moving this to the @Component block (the first option) worked for me for those curious.
This is on the latest version of vue-class-component at the time of writing.
I guess i'll give it another try with the updated packages
I'm on version 0.9.0 for the record.
Does 0.9.0 work for you @orels1?