vuejs如何利用watch开启深度监听

vuejs如何利用watch开启深度监听，下面web建站小编给大家详细介绍一下！

如果watch侦听的是一个对象，如果对象中的属性值发生了变化，则无法被监听到。此时需要使用deep选项，开启深度监听，只要对象中任何一个属性变化了，都会触发“对象的侦听器”。

实现代码如下：

<div id="root">
  <input type="text" v-model="info.name">
</div>
<script src="./vue.js"></script>
<script>
const vm = new Vue({
  el:'#root',
  data:{
    info:{
      name:'admin'
    }
  },
  watch:{
    info: {
      handler(newVal){
          console.log(newVal);
      },
      //开启深度监听
      deep:true
    }
  }
})
</script>