[Vuejs]-Why is the this.$on() callback triggered upon mount of a component?

The issue is with you $on call itself. The parenthesis after updateDirty, this.$on('dirty', this.updateDirty()), is the culprit, it is telling JS to run the function and store the result as the event handler. Try this.$on('dirty', this.updateDirty) instead so you’re passing the reference to the function not the result.