SOURCE

var child = {
  template: `
   <div>
		 <input v-if="obj.m" type="text" v-model="obj.m.m1"/>
	 </div>`,
  props:{
    obj:{}
  },
  watch:{
    obj() {
      console.log("child props obj change");
    }
  }
}


new Vue({
	data:{
  	message:"hello vue!",
    person:{},
    list : [
    	1,2,3
    ],
    listObj:[
     {
     	a:'a',
      b:'b'
     },
     {
     	c:'c',
      d:'d'
     }
    ],
    temp:null
  },
  mounted(){
  	this.temp = this.listObj[1];
    let that= this;
    setTimeout(function(){
      that.person= {
        name: "lilei",
        age: 18,
      	m:{
      		m1:"m1"
    		}
    	};
    },3000)
  },
  el:"#el",
  components:{
    child
  },
  methods:{
    changePerson(){
    	
      this.person = {name1: "李海",age: 34};
      //this.person = Object.assign({},{name: "李海2",age: 22});
      //this.person.name = "韩梅梅";
      //this.person.age = 34;
    },
    changeList(){
    	this.list.push(5);
    },
    setList(){
    	this.list[this.list.length-1] = 999;
      this.list.splice(this.list.length-1,1,999);
    },
    setObj(){
      this.listObj[this.listObj.length-1] = 999;
    	//this.listObj.splice(this.listObj.length-1,1,999);
    },
    changeObj(){
     //this.listObj[this.listObj.length-1] = Object.assign({},{c:'ce',d:'de' });
     //this.listObj.splice(this.listObj.length-1,1,Object.assign({},{c:'ce',d:'de' }));
     //this.$set(this.listObj[this.listObj.length-1],"e","ee");
     //this.listObj[this.listObj.length-1].d = "ee";
     this.temp.d = "ee";
    }
  },
  watch:{
    listObj(){
     console.log("change");
    },
    person(){
    	console.log("person change");
    }
  }
});

<script src="//cdn.bootcss.com/vue/2.2.6/vue.min.js"></script>
<div id="el">
<h1 v-text="message"></h1>
<h3 >{{person.name}}</h3>
<h3>{{person.age}}</h3>
<h3 v-if="person.m">{{person.m}}</h3>
<input type="button" @click="changePerson" value="changePerson"/>
<hr>
<h3>{{list}}</h3>
<input type="button" @click="changeList" value="changeList"/>
<input type="button" @click="setList" value="setList"/>
<hr>
<h3>{{listObj | json}}</h3>
<ul>
  <li v-for="item in listObj">
    {{item}}
  </li>
</ul>
<input type="button" @click="changeObj" value="changeObj"/>
<input type="button" @click="setObj" value="setObj"/>
<hr />
<child :obj="person"></child>
</div>