Использование VueJS 2.0 и компонента меню vue-mdl, как мне реагировать на события кликов?

Question

Он, кажется, не отвечает на @click, но v-bind:click регистрируется. Однако я не могу поместить метод в директиву, так как я не могу получить доступ к компонентам mdl-menu или mdl-menu-item, чтобы добавить этот метод.

Я пытаюсь сделать что-то вроде @click="setStatus('field-name', 'value')" с четырьмя опциями меню (каждый с другим value, тот же field-name).

Я чувствую, что есть элемент VueJS, о котором я еще не знаю, или это будет что-то необычное с событиями.

Я попытался добавления встроенного кода bus.$emit('event', 'data'), но ничего не происходит (без ошибок, ничего в консоли, ничего)

Пример элемента:

<span class="bar" v-on:click="clicked"> 
    <mdl-button icons raised colored 
       v-bind:id="generateId('av')" 
       v-bind:class="getButtonClass(row.avStatus)" 
       v-bind:title="row.avStatus" 
    > 
     <i class="material-icons">videocam</i> 
    </mdl-button> 

    <mdl-menu v-bind:for="generateId('av')"> 
     <mdl-menu-item data-field="avStatus">Open</mdl-menu-item> 
     <mdl-menu-item data-field="avStatus">In Progress</mdl-menu-item> 
     <mdl-menu-item data-field="avStatus">Review</mdl-menu-item> 
     <mdl-menu-item data-field="avStatus">Ready</mdl-menu-item> 
    </mdl-menu> 
</span> 

Edit 1:

Так что я получил событие click to работает прошлой ночью, но я не уверен, что это правильный метод (чувствует себя очень грязно).

Что я сделал добавить v-on:click="clicked" слушателя к родителю span, то в методе clicked() у меня есть:

if (e.target.className == "mdl-menu__item") { /* code */ } 

Чтобы действовать только тогда, когда пункты меню нажата. Это кажется ... неправильным. Не следует ли добавлять слушателя непосредственно в пункт меню или не менее родительскому mdl-menu?

Answer 1

Use the .native modifier on the click. При использовании v-on на компоненте, а не на собственном узле html, vue только ищет событие среди пользовательских событий дочернего компонента, объявленных с помощью $emit, добавьте .native, чтобы vue рассматривал его как родное событие.