Merge mixin's watchers

by ThomasFerro

HTML

<template id="test-component-template">
  <div>
    <input v-model="value"/>
    <pre>{{$data}}</pre>
  </div>  
</template>

<div id="app">
  <merge-component></merge-component>
  <no-merge-component></no-merge-component>
</div>

JavaScript

Vue.mixin({
	data() {
  	return {
    	value: 'test',
      mixinWatcher: false,
    };
  },
  watch: {
  	value: {
    	handler() {
      	console.log('mixin');
      	this.mixinWatcher = true;
      },
    	immediate: true,
    },
  },
});

const MergeComponent = {
	template: '#test-component-template',
  watch: {
  	value: {
    	handler() {
      	console.log('component');
      },
    	immediate: true,
    },
  },
};


const NoMergeComponent = {
	template: '#test-component-template',
};

new Vue({
	el: '#app',
  components: {
  	MergeComponent,
    NoMergeComponent,
  }
});