JSFiddle - React, Tailwind, and code Playground

HTML

<div id="app" class="container">
  open your console
  <parent></parent>
</div>

JavaScript

((Vue) => {
	let child = Vue.extend({
		props: ['someData'],

		template: '<div></div>',

		events: {
			dataLoaded() {
      	console.log('---child:event---')
				this.$log('someData')
				this.$log();
			}
		},

		watch: {
			someData() {
				console.log('---child:watch---')
				this.$log('someData')
				this.$log();
			}
		}
	});

	let parent = Vue.extend({
		data() {
			return {
				someData: null,
			}
		},

		template: '<div><button @click="loadData()">Load</button><child :some-data="someData"></child></div>',

		components: {
			'child': child
		},

		methods: {
			loadData() {
				this.someData = ['some']
        console.log('---parent----')
        this.$log('someData')
        
				this.$broadcast('dataLoaded')
			}
		}
	});

	Vue.component('parent', parent);
	Vue.component('child',  child);

	let app = new Vue({
		el: '#app'
	});	
})(window.Vue)