| 1.旧的虚拟dom和新的虚拟dom对比，首先看他们的key是否相同
2.相同继续对比他们的内容，不同生成新的真实dom进行替换
3.如果内容和key都相同，复用旧的真实dom 不做改变
那么如果我们使用遍历时候自动生成的index作为每个节点的key可能会出现什么问题呢？ 下面放个小案例
首先，初始时我们进行遍历persons
他会是这样一个过程，源数据
persons: [{ id: 1, name: “张三”, age: 15 },{ id: 2, name: “李四”, age: 16 },],生成的真实dom节点
<ul> <li key="0">张三--15</li> <li key="1">李四--16</li> </ul> 然后我们在这个名单前面插入一个{id:3,name:‘王五',age:14}的数据会变成这样子
<ul> <li key="0">王五--14</li> <li key="1">张三--15</li> <li key="2">李四--16</li> </ul> 通过上面的更新可以发现 王五将之前张三的key给占用了
也就是说当我进行更新这一过程首先新的虚拟dom
和旧的虚拟dom
进行比较 新的dom先比较key两人相同，在比较内容一个是王五
Vue如何优雅的清除定时器
vue实现点击翻转效果 |
