JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://unpkg.com/vue@2.4.2/dist/vue.js"></script>
<button id="testBtn">Trigger an event</button>
<div id="app">
<div v-show="this.show">
1st Argument of Custom Event <br />
"{{ one }}"
<br />
2nd Argument of Custom Event <br />
"{{ two }}"
<br />
A complete event object below <br />
{{ event }}
</div>
</div>
JavaScript
//Jquery:
$('#testBtn').on("click", function(event) {
console.log(this, 'this');
$(this).trigger("custom", ["1st", "2nd"]);
});
//vue.js
new Vue({
el: '#app',
mounted () {
let _this = this;
$(document).on("custom", function(event, one, two) {
console.log(event, 'event');
console.log(one, 'one');
console.log(two, 'two');
_this.event = event;
_this.one = one;
_this.two = two;
_this.show = true;
});
},
data () {
return {
show : false,
event : {},
one : '',
two : ''
}
}
});