I need help with an issue in my index.vue file. The problem lies in the fancy box under the after close where I am trying to call the messageAlert method, but it keeps returning this.messageAlert is not a function
Can someone please assist me in resolving this?
<template>
<div>
<v-btn @click="openCal">Open Now</v-btn>
</div>
</template>
<script>
export default {
methods: {
messageAlert() {
alert("Method is called")
},
openCal() {
let src = 'https://google.com/'
$.fancybox.open({
type : 'iframe',
scrolling : 'yes',
src : src,
opts : {
afterShow : function( instance, current ) {
$("body").attr("style", "overflow: hidden; position: fixed;")
$(".fancybox-content").attr("style", "height: 90% !important; overflow: scroll;")
$(".fancybox-content > iframe").attr("style", "height: 101% !important; overflow: scroll;")
$(".fancybox-content > iframe").attr("scrolling", "yes")
},
afterClose : function( instance, current ) {
$("body").attr("style", "")
this.messageAlert();
}
}
});
}
}
};
</script>