[Vuejs]-How can I get a child component's watcher's updated value from parent component in Vue 2?

0👍

You can setup an event listener on the child component element itself where its used in the parent and pass it a method to be executed

//parent component
<div id="app>
    <child-comp @selected-year-change='changeYear'></child-comp>
</div> 

In your parent component use the method changeYear to change the value of `selectedYear’

methods:{
    //you get the event as the parameter
    changeYear(value){
        this.selectedYear = value
    }
} 

See the fiddle

And avoid using camelCase for event names use kebab-case instead as HTML attributes are case-insensitive and may cause problems

0👍

html:

<Parent>
  <Child @selected-year-change=HandleChange(data)></Child>
</Parent>

Javascript/Child Component:

watch: {
  selected (value) {
    this.$emit('selectedYearChange', value)
  }
}

Javascript/Parent Component:

   HandleChange: function(data){}

good luck. maybe work!

Leave a comment