Vue3中ref和toRef的區別

2022-09-14 14:24:13 字數 593 閱讀 1885

1. ref是複製,檢視會更新

如果利用ref將某乙個物件中的某乙個屬性值變成響應式資料

我們修改響應式資料是不會影響原始資料的;

同時檢視會跟新。

ref就是複製 複製是不會影響原始資料的

}按鈕 

2.toref是引用,檢視不跟新
如果利用toref將某乙個物件中的屬性變成了響應式的資料

我們修改響應式的資料是會影響原始資料的

如果資料是通過toref建立的,修改值後,資料不會觸發檢視

toref是引用;它引用的是以前那個物件中的屬性

所以你修改後,會影響到原始資料終中的值

}按鈕 

3.結論
ref複製, 修改響應式資料,不會影響以前的資料,介面會更改。

toref引用, 修改響應式的資料,會影響以前的資料,介面不會更新。

toref的使用場景

如果想讓響應式資料和原始資料關聯起來。

並且更新響應式資料後,不想檢視更新;那麼就可以使用toref

vue3如何通過ref屬性獲取元素

在vue2.x中,可以通過給元素新增ref 屬性,然後在 中通過this.refs.獲取到對應的元素 然而在vue3中時沒有 refs這個東西的,因此vue3中通過ref屬性獲取元素就不能按照vue2的方式來獲取 vue3需要借助生命週期方法,原因很簡單,在setup執行時,template中的元素...

Vue2和Vue3的區別

vue2 的雙向資料繫結是利用es5 的乙個 api object.definepropert 對資料進行劫持 結合 發布訂閱模式的方式來實現的。vue3 中使用了 es6 的 proxyapi 對資料 相比於vue2.x,使用proxy的優勢如下 1 defineproperty只能監聽某個屬性,...

vue2和vue3的區別

vue2 vue3 安裝npm install vue cli g npm install vue cli g 解除安裝npm install vue cli g npm install vue cli g 圖形介面 vue ui 無圖形介面 建立專案 vue init webpack demo v...