Vue2中watch监听props属性无效不触发，而computed可以监听到

问题

父组件通过props传递数据对象中的某个属性值给子组件，子组件中watch监听传来的props的变化执行某些内容。父组件中循环调用自己嵌套了多层。出现即使修改了传值，watch也没有监听到，而computed可以监听到的情况。我遇到的问题大概就是以上的情景，实际项目中更为复杂，难以描述得非常清楚。

解决

使用immediate选项。 原本这个选项是用于要立即以当前值触发监听处理回调的，但是遇到上面这种情况开启这个之后就神奇的解决了。

例如，监听的是传入的checked属性

// children.vue
<script>
export default {
  name: 'Children',
  props: {
    checked: Boolean
  },
  data () {
    return {
      resetChecked: this.checked
    }
  },
  watch: {
//  这种写法监听不到
//  checked(val){
//    this.resetChecked = val;
//  }

// 改成这样写
    checked: {
    	immediate: true,
    	handler(val) {
      		this.resetChecked = val;
      	}
    }
  }
}
</script>

一般情况下，不需要开启immediate也可以监听到的；要是情况不一般，试试开启吧。
要是遇到同样的情况，知道是什么原因导致watch监听不到prop及为什么开启immediate就可以的，麻烦留言告知一下，谢谢！

参考：vue 子组件watch监听不到prop的解决