脚本宝典收集整理的这篇文章主要介绍了React 中的 key 与 diff 优化,脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
在这篇文章中,我会简单讲讲关于 React
中的 key
与 diff
优化。
what
key
是 React
用于追踪列表中元素被修改、被添加或者被移除的辅助标识。
why
React
通过对列表中元素设置唯一 key
,对 virtual-dom
的 diff
过程进行算法优化。
how
在 React
的 diff
过程中 React
会通过元素的 key
值来判断该元素是否已经存在?是否需要创建?是否需要移动位置?从而减少不必要的元素渲染。
usage
-
key
应该在数组内,且在兄弟元素之间是唯一标识,但不需要是全局唯一。
- 不推荐使用索引来作为
key
,因为 index
并不是稳定不变的,在不同的更新过程中,下标可能不同,所以当列表项顺序发生改变时,渲染将会较慢。
-
key
只是给 React
内部使用,不会被传给组件。
best PRactise
使用列表元素的 id
作为键值。
以上是脚本宝典为你收集整理的React 中的 key 与 diff 优化全部内容,希望文章能够帮你解决React 中的 key 与 diff 优化所遇到的问题。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。