前端懒加载之trackBy

有时候一次性从后台拿到大量数据后渲染到页面上的时候比较卡，而获取数据的接口还是比较快的，这时候就需要前端懒加载了。
一般我们在组件中用*ngFor遍历数据渲染页面，我们可以在html中这样做：

<div nz-popconfirm *ngFor="let user of sharedUsersValues; let i = index; trackBy: userTrackBy">
      <span class="user-label">{{ user.label }}</span>
</div>

在ts中这样做：

userTrackBy(index: number, user: ShareUserOption) {
    return user.value.userId;
  }

在页面中添加一个加载更多的按钮，每次点击时就会加载更多的数据（往sharedUsersValuespush更多（定量）的数据），而trackBy支持每次只渲染新增加的数据，而不会重新渲染全部的数据，这样可以大大缓解页面卡顿的现象。

当然解决方式还有很多，比如分页等等。