Vuejs Passing Data from child to parent

user_8165995 0
Viewed 34

Need some help. I have a component

<BasicFilter></BasicFilter>

with a select

<select @change="$emit('onSortName', $event)">
<option value="asc"> A..Z</option><option value="desc"></select>

and want to pass the selected value to a function in parent:

onSortName(event) {
  if (event.target.value == 'desc') {
    do something
  }
}

How to pass the event.target.value to the function in the parent?

vuejs2 vue.js javascript
1 Answers

In child you emit event with data you want to send to parent:

<select @change="$emit('onSortName', data)">

in parent template you listen to event:

<BasicFilter @onSortName="onSortName"></BasicFilter>

method to do something on event from child

methods: {
  onSortName(val) {
    if (val == 'desc') {
      //do something
    }
  }
}
user_119891890
Related