javascript – How can a parent vue component listen to a iframe event which is a HTML page?

I’ve created a component that stores an iframe

<template>

<iframe height=1000 width=100% :src="full" @myEvent="thisMethod" ></iframe>

</template>

<script>
export default {
    data() {
        return {
            path: '../lib/pdfjs-2.7.570-dist/web/viewer.html',
            name:'../t1.pdf',
            full: '../lib/pdfjs-2.7.570-dist/web/viewer.html?file=pdfs/t1.pdf'
        };
    },
  props: {
    fileName: String,
    path:String
  },

  methods:{
    thisMethod(){
        console.log("Hello from Parent")
    }
  }
}
</script>
<style scoped>
div {
  width: 50%;
  height: 79vh;
  min-width: 400px;
}
</style>

Inside my viewer.html I want to fire an Event to my parent so that ‘thisMethod’ would be called.
I’ve tried doing:

<html>
 A lot of HTML tags
</html>
<script>
      function myfunction(data){
         this.$emit('myEvent',data)
      }
</script>

but viewer is a html page and I can’t seem to find a way to send an event from a .html file to a .Vue file.
My question is basically what would be a solution to be able to handle a JavaScript event in a HTML page inside a .vue parent page ?