Представьте себе компонент со следующей структурой HTML:
<template>
<div class = "row">
<div class = "innerRow">
<div class = "outterLabel">
<label class = "labelCss">{{label}}</label>
</div>
<div class = "outterField">
<span style = "float: none; position: absolute;">
<select ref = "selectField">
<option v-for = "item in list">{{item.name}}</option>
</select>
</span>
</div>
</div>
</div>
</template>
Когда я использую этот компонент, я хочу передавать события v-on, но я хочу, чтобы они были прикреплены к элементу <select>, а не к <div> вверху. Есть ли способ добиться этого во Vue?
Спасибо



![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)


Все слушатели будут прикреплены к корневому элементу. Это поведение по умолчанию. Чтобы изменить это, вы можете использовать опцию $listeners.
Итак, чтобы можно было прикрепить слушателей к элементу select следующим образом:
<select v-on = "$listeners" ref = "selectField">
<option v-for = "item in list">{{item.name}}</option>
</select>
Теперь вы можете прикреплять прослушиватели событий непосредственно к своему настраиваемому компоненту выбора.
<my-select v-on:change = "doSomething"></my-select>
Для получения дополнительной информации посетите - Создание полностью прозрачных компонентов оболочки
Спасибо. Это именно то, что мне было нужно.