Как прослушать события вложенных компонентов в Vue - PullRequest
Новая
       40

Как прослушать события вложенных компонентов в Vue

0 голосов
/ 09 января 2019

Я хочу получить событие "input" от вложенного компонента, которое, как я вижу, запускается из расширения Vue Chrome Devtools enter image description here

Я могу только прослушивать событие "input" в VDatePicker , используя директиву v-on. Есть ли способ прослушать VDatePickerDateTable событие «input» без расширения компонента VDatePicker ? 

<template>
    <v-date-picker v-model="selectedDays" multiple @input="onDayClick"/>
</template>

<script>
    export default {
        methods:{
            onDateClick(data){
                console.log(data); // ["2019-01-01", "2019-01-02", "2019-01-06"]
            }
        }
    }
</script>

1 Ответ

0 голосов
/ 10 января 2019

Я так и сделал. Используя ссылку на VDatePicker и следуя за ней во вложенную ссылку своего дочернего элемента, VDatePickerDateTable для прослушивания своего события «input». Причина, по которой я думаю, что входные данные для VDatePicker пропускают массив строк с датами, заключается в том, что это средство выбора нескольких дат, определенное атрибутом множественный в компоненте. Это было добавлено в Vuetify 1.2 .

Теперь она передает дату, по которой щелкнули, обработчику. Я хотел бы знать, если у кого-то есть лучший способ. 

<template>
    <v-date-picker ref="datePicker" v-model="selectedDays" multiple/>
</template>

<script>
export default {
    mounted(){
            this.$refs.datePicker.$refs.table.$on('input', this.onDayClick);
    },
    methods: {
        onDateClick(data) {
            console.log(data); // "2019-01-01"
        }
    }
};
</script>
...