Слушайте пользовательское событие в Vue.js

Vue.js прекрасно работает с событиями браузера, такими какclick или жеmousedown, Но не работать вообще с пользовательскими событиями. Вот код:

HTML:

<div id="app" style="display: none" v-show="true">
    <div v-el:ping v-on:ping="ping">
        <div>
            <button v-on:click="click">Click</button>
        </div>
    </div>
</div>

JavaScript:

new Vue({
    el: '#app',
    data: {
    },
    methods: {
        ping: function (event) {
            console.log('Vue ping', event);
            alert('Vue ping');
        },
        click: function (event) {
            jQuery(event.target).trigger('ping');
        }
    },
    ready: function () {
        console.log(this.$els);
        jQuery(this.$els.ping).on('ping', function (event) {
            console.log('jQuery ping', event);
            alert('jQuery ping');
        });
    }
});

Я ожидаю тревоги сVue ping а такжеjQuery ping, Но только позже всплывает.

CodePen

Ответы на вопрос(1)

Ваш ответ на вопрос