巨大列表中的 NativeScript virtualScroll答案

【问题标题】：NativeScript virtualScroll in huge list巨大列表中的 NativeScript virtualScroll
【发布时间】：2017-08-14 07:16:02
【问题描述】：

在此之前，我将 Ionic 用于我的跨平台应用程序。使用 Angular 重复时，大型列表中存在性能和内存问题。

但 ionic 有一个名为 virtualRepeat 的功能（或 v1.x 中的 collection-repeat）。但是它有很多错误并且无法使用。

NativeScript 中有这样的功能吗？（它不能让列表中的所有元素保持活动状态，并且随着用户滚动更改列表。）React Native 中提供了相同的功能。

我还拍摄了一个截图视频用于性能演示。起初我有20个项目。然后为了在滚动中加载更多内容，我加载了一个非常大的列表。然后，看看结果：

https://www.youtube.com/watch?v=220FS2SqLqI

【问题讨论】：

标签： nativescript angular2-nativescript

【解决方案1】：

在 Nativescript 中，您将希望使用 ListView 而不是 ngFor 或其他重复技术，Listview 重用视图并减少大列表的内存使用量

例子

<ListView [items]="myItems">
   <template let-item="item">
       <StackLayout>
          <Label [text]='item.name'></Label>
       </StackLayout>
    </template>
</ListView>

【讨论】：

【解决方案2】：

最后我发现，它使用虚拟化。我运行了这个命令：

tns debug android

然后我可以从 chrome 开发工具中看到元素：

它只使用几个元素，并且在滚动时会改变它们。

【讨论】：