Согласно документации - Передача данных вместе с событием: Вы можете отправить определённые данные вместе с событием. Например, если нужно, чтобы дочерний компонент отправлял данные родительскому компоненту, мы можем использовать второй параметр $emit
для предоставления этого значения:
this.$emit('get-method', this.users)
, если обработчик события будет методом (допустим):
... @get-method="newMethod" ...
, тогда значение будет передано первым аргументом:
newMethod(users) {
this.users = users
},
Привожу полный пример:
Vue.component('child',{
data(){
return {
users: ['Viktor','Ruslan', 'Alex']
}
},
methods: {
getUsers() {
this.$emit('get-method', this.users)
}
},
template: `
<fieldset>
<legend>Дочерний компонент</legend>
users = {{ users }}
<button @click="getUsers">Отправить users родителю</button>
</fieldset>
`
})
Vue.component('parent',{
data(){
return {
users: []
}
},
methods: {
newMethod(users) {
this.users = users
},
},
template: `
<fieldset>
<legend>Родительский компонент</legend>
users = {{ users }}
<child @get-method="newMethod" ref="showmodal"></child>
</fieldset>
`
})
new Vue({
el: '#app'
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.min.js"></script>
<div id="app">
<parent></parent>
</div>