一、虚拟DOM中key的作用:
1.简单概括:key是虚拟DOM对象的标识,在更新显示时key有很重要的作用
2.具体重要作用:当数据发生改变时,react会根据新数据生成新的虚拟DOM,然后react会进行 新虚拟DOM和 旧虚拟DOM的DIFF比较,规则如下:
1).旧虚拟DOM中找到与新虚拟DOM相同的key之后会进行内容的比较,若内容变了则生成新的真实DOM,替换掉页面中之前的真实DOM,若没有改变,则继续使用原来页面中的真实DOM
2).旧虚拟DOM中没有找到与新虚拟DOM相同的key,根据数据创建新的真实DOM,渲染到页面
二、用index作为key可能会引发的问题:
1.若对数据进行:逆序添加、逆序删除等破坏顺序操作,会产生没必要的真实DOM更新,界面效果虽然正常显示,但是效率低
2.如果结构中还包含输入类的DOM,会产生错误DOM更新,界面显示会出问题
注意:若不存在对数据逆序添加、逆序删除等破坏顺序操作,仅用于渲染列表,使用index作为key没有问题