diff算法

逐層對比，最小的力度是標簽
1、虛擬DOM中key的作用：

• 1-1、簡單的說：key是虛擬DOM對象的標識，在更新顯示時key起著極其重要的作用。
• 2-2、詳細的說：當狀態的數據發生變化時，react會根據【新數據】生成【新的虛擬DOM】，隨著React進行【新虛擬DOM】與【舊虛擬DOM】的diff比較，比較規則如下
  • a、舊虛擬DOM中找到了與新虛擬DOM相同的key：
    • a-1、若虛擬DOM中的內容沒變，直接使用之前的真實DOM
    • a-2、若虛擬DOM內容變了，則生成新的真實DOM，隨后替換掉頁面之前的真實DOM
  • b、舊虛擬DOM中未找到與新虛擬DOM相同的key
    根據數據創建新的真實DOM，隨后渲染到頁面

2、用index作為key可能會引發的問題

• 2-1、若對數據進行：逆序添加、逆序運算、逆序刪除等破會順序操作：
  會產生沒有必要的真實DOM更新====>界面效果沒問題，但效率低。
• 2-2、若果結構中還包含輸入類的DOM:
  會產生錯誤DOM==>界面有問題。
• 2-3、注意！如果不存在對數據逆序添加、逆序刪除等破壞順序操作，
  僅用于渲染列表用于展示，使用index作為key是沒有問題的。

3、開發中如何選擇key?

• 3-1、最好使用每條數據的唯一標識作為key，比如id、手機號、身份證號、學號等唯一值。
• 3-2、如果確定知識簡單的展示數據，用index也是可以的。

總結

以上是生活随笔為你收集整理的算法篇(暂时就接触一个)的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。