Vue

by luckylooke

HTML

<div id="app">
   <h1>{{ message }} - {{ myProp }}</h1>
</div>

Vue

new Vue({
  el: "#app",
  data: {
    message: "Hello!",
    myPropInternal: 0,
  },
  computed: {
    myProp: {
      // getter
      get: function () {
      console.log('get', this.myPropInternal);
      return this.myPropInternal;
      },
      // setter
      set: function (value) {
      console.log('set', value);
      this.myPropInternal = value;
      }
    }
  },
  watch: {
    myProp: function(myProp) {
			console.log('react in watcher', myProp);
		}
  },
  created: function() {
  	this.myProp = 1;
  	this.myProp = 2;
  	this.myProp = 3;
  }
})