Я нашел что-то странное в директиве vue.js @cllick.native

Question

new Vue({ .....
   methods: {
       func () { alert('something') }
   },
   template: `
    <div id="#app">
        <top-bar :players="players" :current-player-index="currentPlayerIndex" 
:turn="turn" @click.native="func"></top-bar>
        <hand :cards="testHand" @click.native="func"></hand>
    </div>`
}

Выше приведен фрагмент полного кода. Вы можете увидеть директиву @click.native="func". Два элемента top-bar и hand имеют его. событие клика top-bar срабатывает очень хорошо. Тем не менее, событие нажатия руки не работает. Интересно, почему одни и те же директивы ведут себя по-разному. Кто-нибудь, пожалуйста, дайте мне знать причину этого.