vue watchオブジェクトまたは配列の問題


普通のwatchはこんな感じです:
data() {
    return {
        frontPoints: 0    
    }
},
watch: {
    frontPoints(newValue, oldValue) {
        console.log(newValue)
    }
}

配列のwatchはこのようなものです.
data() {
    return {
        winChips: new Array(11).fill(0)   
    }
},
watch: {
  winChips: {
    handler(newValue, oldValue) {
      for (let i = 0; i < newValue.length; i++) {
        if (oldValue[i] != newValue[i]) {
          console.log(newValue)
        }
      }
    },
    deep: true
  }
}

対象のwatchはこんな感じ
data() {
  return {
    bet: {
      pokerState: 2342,
      pokerHistory: 'local'
    }   
    }
},
watch: {
  bet: {
    handler(newValue, oldValue) {
      console.log(newValue)
    },
    deep: true //      
  }
}

しかしそれだけではオブジェクトの変動を傍受するしかなく,具体的にどの値が変動したのかは取得できない.
機知に富んだ私たちは計算属性という方法を利用して問題を処理することができて、コードは以下の通りです.
data() {
  return {
    bet: {
      pokerState: 2342,
      pokerHistory: 'local'
    }   
    }
},
computed: {
  pokerHistory() {
    return this.bet.pokerHistory
  }
},
watch: {
  pokerHistory(newValue, oldValue) {
    console.log(newValue)
  }
}