JSFiddle - React, Tailwind, and code Playground
HTML
<div id="app">
<layout></layout>
<item />
</div>
JavaScript
Vue.prototype.$bus = new Vue();
Vue.component("item", {
template: `<div><button @click="update">Click</button></div>`,
methods: {
update() {
this.count += 1;
this.$bus.$emit('updateCount', this.count);
}
},
data(){
return {
count: 0,
};
},
});
Vue.component("layout", {
template: `<div>{{count}}</div>`,
created() {
this.$bus.$on('updateCount', (countVal) => {
this.count = countVal;
});
},
data(){
return{
count: 0,
}
}
});
var vm = new Vue({
el: '#app',
data: {}
});