在之前,vue是通過Object.defineProperty來實現響應式的,但在vue3.0中,改為使用proxy實現
在我看來,Object.defineProperty有以下幾個問題:
- 不能監聽對象屬性的新增和刪除。只對獲取和更改進行了處理。
- 通過索引更改數組對象不能被監聽,如arr[1] = 2
Object.defineProperty不能再get或set中使用該對象。因為使用該對象,即觸發了get方法,會進入死循環。需要對被訂閱對象進行拷貝,使用拷貝的對象。- 需要遍歷對象中的各個屬性,對其使用
Object.defineProperty進行set/get的改寫。
在目前,解決第一個和第二個問題的方式是通過vue.set(target, key, value)來實現
在使用proxy時,創建代理對象。使用target和key,傳入需要實現響應式的對象和屬性。通過代理實現了目標對象的響應式。
