watchEffect 是 Vue3 中提供的新特性，用於監聽響應式資料的變化，並在資料變更時執行指定的回呼函數。
與Vue2 中的watch 不同，watchEffect 不需要指定要監聽的數據，而是會自動追蹤函數中使用的響應式數據，並在這些資料發生變化時重新執行回呼函數。這種自動追蹤的特性可以簡化程式碼，並提高應用的效能。
下面是一個使用watchEffect 的範例：
import { watchEffect, reactive } from 'vue'
const state = reactive({
count: 0
})
watchEffect(() => {
console.log(state.count)
})在上面的程式碼中，我們使用reactive 函數建立了一個響應式物件state，並使用watchEffect 監聽了state.count 屬性的變更。當 state.count 改變時，回呼函數會被重新執行。
要注意的是，watchEffect 傳回一個無需停止的監聽器函數。如果需要停止監聽，可以呼叫這個監聽器函數來停止監聽。
除了監聽響應式資料的變化外，watchEffect 還支援在回呼函數中存取元件的上下文，例如 this 關鍵字和元件的計算屬性等。
下面是一個使用watchEffect 存取元件計算屬性的範例：
import { watchEffect, computed } from 'vue'
export default {
computed: {
doubleCount () {
return this.count * 2
}
},
mounted () {
watchEffect(() => {
console.log(this.doubleCount)
})
}
}在上面的程式碼中，我們使用computed 函數建立了一個計算屬性doubleCount，並在mounted 鉤子函數中使用watchEffect 監聽了doubleCount 的變更。當 doubleCount 改變時，回呼函數會被重新執行。
以上是Vue3中的watchEffect特性是什麼的詳細內容。更多資訊請關注PHP中文網其他相關文章！
