vuejsの親要素と子要素の間でクリックイベントハンドラを分離する方法

Question

semantic-uiコンポーネントをjQueryの代わりにvuejsに頼りに変換しようとしていますが、v-onの分離方法がわかりません：それは親要素です。

この例では、私はv-onを使用しています：トグル機能を使用したドロップダウンメニューを表示するボタンをクリックし、別のv-onがあります。

問題は、削除アイコンをクリックしている間に、ドロップダウンメニューが表示されることです。

これを防ぐにはどうすればよいですか？

`https://jsbin.com/minezij` 

Answer 1

あなたは親要素にイベントの伝播を停止するstopEvent Modifiersを使用することができます。

<!-- the click event's propagation will be stopped --> 
<a v-on:click.stop="doThis"></a>