手摸手-學習 Vue3 之 變量聲明【ref 和 reactive】區別
- 前言
- ref 擴展
- ref 和 reactive 區別
前言
ref 擴展
在之前博文《（2）手摸手-學習 Vue3 之 變量聲明【ref 和 reactive】》中有提到：
當時已基本類型 進行演練說明，此時以 對象 類型，加以說明：
- 在使用
ref創建對象前，先行使用reactive創建對象，回顧之前博文內容，如下：
總結
(reactive)：
（1）在操作其對象屬性時，直接操作即可，無需使用.value
（2）控制臺中可查看，創建的對象為 Proxy
- 使用
ref創建對象，如下：
查看瀏覽器：
總結
(ref)
(1) 在代碼層面，操作對象屬性值時，需使用.value，不能直接操作。
(2) 控制臺查看，其創建的對象為RefImpl其內 value 屬性值對象為Proxy(底層和reactive一樣）
ref 和 reactive 區別
經過上述的功能驗證測試，這里進行總結：
（1）ref 可以創建 基本類型 、及對象類型。reactive 只能創建對象類型。
（2）ref 在操作變量時，不能直接操作變量值，需先使用 .value。reactive 在操作變量時，可以直接操作變量值，無需使用.value
（3）底層（控制臺可查看）創建出的對象不同：reactive 創建的為Proxy，ref 創建的為 RefImpl 但其內 value 屬性值為 Proxy 對象。
若有轉載，請標明出處：https://blog.csdn.net/CharlesYuangc/article/details/149126966
