VueJS: watching two properties

Question

Suppose I have two data properties:

data() {
  return {
    a: false, 
    b: false, 
  }
}

When a and b become true at the same time, I want to carry out a related task.

How can I use a watch method in Vue to achieve this?

Answer 1

Watch a computed value.

computed:{
    combined(){
        return this.a && this.b
    }
}
watch:{
    combined(value){
        if (value)
            //do something
    }
}

There is a sort of short hand for the above using $watch.

vm.$watch(
  function () {
    return this.a + this.b
  },
  function (newVal, oldVal) {
    // do something
  }
)