React中的唯一标识key(用index VS id)和key的选择
生活随笔
收集整理的這篇文章主要介紹了
React中的唯一标识key(用index VS id)和key的选择
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
1. 虛擬DOM中key的作用:1). 簡單的說: key是虛擬DOM對象的標識, 在更新顯示時key起著極其重要的作用。2). 詳細的說: 當狀態中的數據發生變化時,react會根據【新數據】生成【新的虛擬DOM】, 隨后React進行【新虛擬DOM】與【舊虛擬DOM】的diff比較,比較規則如下:a. 舊虛擬DOM中找到了與新虛擬DOM相同的key:(1).若虛擬DOM中內容沒變, 直接使用之前的真實DOM(2).若虛擬DOM中內容變了, 則生成新的真實DOM,隨后替換掉頁面中之前的真實DOMb. 舊虛擬DOM中未找到與新虛擬DOM相同的key根據數據創建新的真實DOM,隨后渲染到到頁面2. 用index作為key可能會引發的問題:1. 若對數據進行:逆序添加、逆序刪除等破壞順序操作:會產生沒有必要的真實DOM更新 ==> 界面效果沒問題, 但效率低。2. 如果結構中還包含輸入類的DOM:會產生錯誤DOM更新 ==> 界面有問題。3. 注意!如果不存在對數據的逆序添加、逆序刪除等破壞順序操作,僅用于渲染列表用于展示,使用index作為key是沒有問題的。3. 開發中如何選擇key?:1.最好使用每條數據的唯一標識作為key, 比如id、手機號、身份證號、學號等唯一值。2.如果確定只是簡單的展示數據,用index也是可以的。
總結
以上是生活随笔為你收集整理的React中的唯一标识key(用index VS id)和key的选择的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 直播ps5游戏需要什么配置的电脑?
- 下一篇: 直播游戏的话电脑需要怎样的配置?