vue中使用watch监听对象中的属性

// 表单绑定
  teamForm:{
      teamName:'',
      teamDes:'',
      teamGuid:'',
  },

想要监听teamName的改变，获取新值之后执行一定的逻辑操作。由于对象是引用类型的值，直接监听teamForm是不能直接监听到的。想要监听对象中属性的改变，目前有两种方式如下：

方式一：使用对象.属性名的方式，并使用引号对其进行包裹

watch: {
	 'teamForm.teamName':(newVal)=>{
	     console.log(newVal)//获取到最新值
	 }
}

方式二：巧用计算属性

computed: {
	//对需要监听的属性进行获取
    teamName:function(){
        return this.teamForm.teamName
    },
},
watch: {
     //对计算属性中的teamName进行监听
     teamName:function(newVal){
         console.log(newVal)//获取到最新值
     }
 }