目錄
1、所謂響應式數據
2、ref創建基本類型響應式數據
3、reactive創建對象類型響應式數據
4、ref定義對象類型響應式數據
5、總結:ref和reactive對比
6、補充:toRefs與toRef
1、所謂響應式數據
? ? ? ? 所謂響應式數據就是,在vue頁面中,template標簽內的數據是渲染在頁面的數據,一般需要和script標簽內的數據進行綁定,也就是說在script標簽內會進行一些邏輯計算改變一些數據的值。那么如果不使用響應式數據,script標簽內更改了數據的值,template渲染在頁面的值是不會發生改變的。
2、ref創建基本類型響應式數據
注意這里是基本類型
看看數據的內容發生了什么變化:
3、reactive創建對象類型響應式數據
輸出對象到控制臺:
4、ref定義對象類型響應式數據
展現數據不變:
ref底層創建響應式數據時,底層還是使用reactive來創建的
5、總結:ref和reactive對比
(1)插件自動補充.value
(2) reactive重新分配對象,會失去響應式
給變量car重寫分配一個對象:
解決辦法:
修改后:
總結:
(3)如果是ref定義的響應式對象,要重寫賦值對象的內容
使用建議:
6、補充:toRefs與toRef
?
如何變成響應式的解構:
結果:
對于toRefs取多個(對象),toRef是取單個
效果
?
?
?
?
?