
trackBy是angualr优化项目性能的一种方法, 通过返回一个具有绑定性的唯一值, 比如id,手机号,身份证号之类的,来让angular能够跟踪数组的项目,根据数据的变化来重新生成DOM, 这样就节约了性能。
但是如果是使用ngFor循环组件,添加trackBy的时候就需要注意这个组件自身的数据更新机制是否正常,因为没有使用trackBy的时候,for循环的数组数据改变了,angular会把数组里所有的项目都重新生成,那些项目的组件也都会重新初始化。
但当你使用了trackBy,数据发生了变化,angular只会把那些数据有变化的项目重新生成,这样项目的组件也不会重新初始化,如果这个组件的数据更新机制不够好,这时就会因为数据更新的问题,产生bug。
接下来我用一个例子来演示一下
这是子组件test
import { Component, Input, OnChanges, SimpleChanges } from '@angular/core'; @Com

本文介绍了Angular中使用trackBy优化性能的方法,以及在ngFor循环中注意组件数据更新机制的重要性。示例中,未使用trackBy时组件会随数据变化重置,而使用后只有实际变更的项更新,但如果组件数据更新机制不完善,可能导致bug。
最低0.47元/天 解锁文章

被折叠的 条评论
为什么被折叠?



