How to achieve deep nested watch in vue?

I figured i could use deep:true property but my object is nested 1 more level. Following is object

sampleObj{
	key:{
		innerKey: innerValue,
		innerKey: innerValue,
	}
}

i want to watch for changes in innerKey value how do i achieve that?

what i have so far

watch(
  sampleObj,
  async (newValue, oldValue) => {
    console.log("watch", newValue, oldValue);
  },
  { deep: true }
);

Watch checks for 1 level i.e key:value. For above code newValue and oldValue is similar.

i checked doc.

Level 1

On my approach the following worked just fine.

watch(sampleObject.value.key, function(newValue, oldValue) {
	console.log(newValue, oldValue);
});

Keep in mind that value is required if your object is defined as an ref! Otherwise remove it :D

Please or to participate in this conversation.