react key值的理解

2022-07-25 07:12:10 字數 453 閱讀 8022

key不是給開發者使用的,是給

react

在diff

演算法中使用的

,diff

演算法會比較新舊虛擬

dom,

並且是同層比較

,當同一層中有多個元素的時候

,會比較這一層的

key值

,如果key相同

,屬性改變更新屬性

,位置改變就移動位置

,不會發生刪除建立元素

,(只會將舊虛擬

dom的節點位置移動

.)如果key不同

,就會先刪除元素在建立元素

.所以我們千萬不要用index,時間戳等作為

key值

.像我用

index

作為key,

那假如我刪除乙個元素

,會導致很多

key都會改變

.時間戳同理

React key值的作用和使用

react 中的key 屬性是乙個特殊的屬性,它的出現不適給開發者用的,列如你為乙個元件設定key 之後,也無法獲取這個元件的key值,而是給react 自己用的。簡單說,react利用key來識別元件,他是一種身份標識,就像每個人有乙個身份證來做辨識一樣。每個key 對應乙個元件,相同的key r...

react key 的使用 筆記

1 為什麼要用key 官方詳細介紹 當react進行渲染時 會進行遍歷兩個dom節點的子元素 進行對比 有變化時 就產生乙個mutation 官方說法 個人理解是變化值 如果說在子元素末尾進行渲染 react會進行匹配第乙個和第二個元素所對應的樹 然後進行插入 這種插入方式 並不特別消耗效能 如果說...

sizeof 聯合 值的理解

sizeof 聯合 值的理解 先來看各種型別在記憶體中所占用的空間大小 include int main void 執行結果 單位是位元組 int sizeof 4 char sizeof 1 float sizeof 4 double sizeof 8 再寫乙個聯合的例子,並列印出最終值 incl...