I am familiar with using $emit to pass data from child components to parent components in VueJS, but I am trying to retrieve that value in a JavaScript function. Here is my situation:
Parent Component
created () {
this.$on('getValue', function (params) {
console.log('PARAMS: ' + params)
})
},
Child Component
methods: {
checkBoxChanged (index) {
this.$emit('getValue', 'some value')
},
}
Unfortunately, it doesn't seem to work as expected. I know a solution involves setting up listeners in the Parent Component using HTML like below, but for some reasons, I can't do it:
<template>
<div>
<h1>{{ message }}</h1>
<child v-on:listenerChild="listenerChild"/>
</div>
</template>
My goal is to achieve this functionality purely through JavaScript.