$watch是Vue.js提供的一個(gè)非常強(qiáng)大的API，它可以用來(lái)監(jiān)聽(tīng)數(shù)據(jù)變化并在數(shù)據(jù)變化后自動(dòng)執(zhí)行一些邏輯。這對(duì)于實(shí)現(xiàn)數(shù)據(jù)的實(shí)時(shí)響應(yīng)，及時(shí)執(zhí)行一些副作用操作等非常實(shí)用。

在Vue中，我們可以通過(guò)$watch來(lái)監(jiān)聽(tīng)某個(gè)數(shù)據(jù)的變化，當(dāng)這個(gè)數(shù)據(jù)發(fā)生變化時(shí)，我們注冊(cè)的回調(diào)函數(shù)將會(huì)被自動(dòng)調(diào)用。

// 聲明式寫(xiě)法
watch: {
// 監(jiān)聽(tīng) firstName 屬性，當(dāng)它發(fā)生變化時(shí)執(zhí)行回調(diào)函數(shù) handler
firstName: function (val) {
console.log('firstName變化后的值為:', val)
},
// 將 obj 屬性下的 firstName 與 lastName 屬性進(jìn)行深度監(jiān)聽(tīng)（只要它們或者它們的子屬性發(fā)生變化就會(huì)執(zhí)行回調(diào)函數(shù)）
'obj.firstName': {
handler: function (val) {
console.log('obj.firstName變化后的值為:', val)
},
deep: true
}
}
// 命令式寫(xiě)法
var unwatch = vm.$watch('firstName', function (val) {
console.log('firstName變化后的值為:', val)
})
// 停止觀察
unwatch()

除了監(jiān)聽(tīng)某個(gè)特定的數(shù)據(jù)變化，我們還可以通過(guò)$watch來(lái)監(jiān)聽(tīng)一個(gè)表達(dá)式的變化。例如，下面的代碼是在監(jiān)聽(tīng)一個(gè)計(jì)算屬性的變化：

watch: {
// 監(jiān)聽(tīng) fullName 表達(dá)式的變化，在它發(fā)生變化時(shí)執(zhí)行回調(diào)函數(shù) handler
'fullName': function (val) {
console.log('fullName變化后的值為:', val)
}
}

總之，$watch是一個(gè)非常重要的API，在我們實(shí)現(xiàn)Vue中的雙向數(shù)據(jù)綁定、監(jiān)控?cái)?shù)據(jù)變化、實(shí)現(xiàn)實(shí)時(shí)響應(yīng)等方面發(fā)揮了非常重要的作用。