key在Vue是DOM对象的标识；
进行列表展示时，默认key是index；
如果数据只做展示使用，使用index作为key是没有任何问题的；
如果使用index作为key，而后续操作会破坏顺序，一定会带来效率问题，严重时会渲染出错误的DOM
2. key的作用
key就是一个标识，被使用在Vue中。再详细一点，key被使用在Vue中的虚拟DOM中，并不会出现在真实DOM中。
3. key的实现原理
要解释key的实现原理，就要引入Vue一个十分重要的概念——【虚拟DOM】。
给出一组数据，Vue要把这些数据渲染到页面上，首先要生成【虚拟DOM】，然后根据【虚拟DOM】去生成【真实的DOM】。如果数据发生了改变，Vue会生成【新的虚拟DOM】，注意，这个【新的虚拟DOM】并不会直接生成【新的真实DOM】，否则虚拟DOM一点用处也没有了。Vue的操作是，拿根据新的数据生成的【新的虚拟DOM】与之前的【真实的DOM】去做比较，如果相同，直接延用即可（“拿来主义”）；如果不同，则生成新的DOM对象。
进行列表展示时，默认key是index；
如果数据只做展示使用，使用index作为key是没有任何问题的；
如果使用index作为key，而后续操作会破坏顺序，一定会带来效率问题，严重时会渲染出错误的DOM
2. key的作用
key就是一个标识，被使用在Vue中。再详细一点，key被使用在Vue中的虚拟DOM中，并不会出现在真实DOM中。
3. key的实现原理
要解释key的实现原理，就要引入Vue一个十分重要的概念——【虚拟DOM】。
给出一组数据，Vue要把这些数据渲染到页面上，首先要生成【虚拟DOM】，然后根据【虚拟DOM】去生成【真实的DOM】。如果数据发生了改变，Vue会生成【新的虚拟DOM】，注意，这个【新的虚拟DOM】并不会直接生成【新的真实DOM】，否则虚拟DOM一点用处也没有了。Vue的操作是，拿根据新的数据生成的【新的虚拟DOM】与之前的【真实的DOM】去做比较，如果相同，直接延用即可（“拿来主义”）；如果不同，则生成新的DOM对象。
展开
评论
点赞