React渲染方式：
React在渲染时先将需要渲染的数据在内存中生成虚拟DOM，然后再将生成的虚拟DOM渲染到页面生成真实DOM。 即：数据 ---> 虚拟DOM ---> 真实DOM。
问题引出
而在我们使用React构建页面时有时会收到一个报错：Warning: Each child in a list should have a unique "key" prop.，即每一个单独的结构应该有一个唯一的key值。这个时候我们很容易就能想到用遍历数据过程中生成的数组index作为他们的key值。
但是这样就会有一个问题，这样可能会造成电脑运行的负担增加。因为由上可以知道React生成页面的过程，在页面数据更新时也会重复该过程，但是React会将更新后的虚拟DOM与更新前的虚拟DOM进行比较，只更新数据有变化的那一部分，而这中间用于对比辨识虚拟DOM的就是每个DOM的key值。
因为我们知道在对数组数据遍历数据时，生成的key值是有顺序的，且当在某一个地方插入一条数据，那么他之后所有的数据的index值都会变化，这就是问题所在，加入我们在初始数据的头部加了一条数据，那么新生成的虚拟DOM对比原来的数据虽说只增加了一条，但是所有的数据的唯一标识index都发生了变化。会导致每一条数据都会重新渲染。当数据量非常多的时候，就会造成不必要的性能浪费。
解决方案
我们以上所说的对比新旧虚拟DOM的方法就是diff算法，它可以在更新页面时不更新页面数据没有发生变化的部分，该算法本来的目的是尽可能的减少计算负担，但是使用index作为key值之后反而背道而驰了。所以一般情况下建议不把index值作为唯一标识key值。
但是，当确定数据永远不会发生改变或者新数据肯定是在尾部添加时，也可以使用index作为key值。
