Ionic 3 - approxItemHeight 在 vi​​rtualScroll 中不起作用

Question

我有一个 virtualScroll，我在其中指定 approxItemHeight：

<ion-list [virtualScroll]="myArray" [approxItemHeight]="'320px'">
    <ion-item *virtualItem="let myItem"></ion-item>
</ion-list>

ionic 创建列表时 approxItemHeight 值似乎被忽略了。

这是页面加载时的 ion-list 元素：

<ion-list class="list list-ios virtual-scroll" ng-reflect-virtual-scroll="[object Object],[object Object" ng-reflect-approx-item-height="320px" style="height: 89px;">

整个列表的样式指定为 89px，尽管我将 approxItemHeight 指定为 320px。

这是页面加载时列表中的第一个 ion-item 元素：

<ion-item class="item item-block item-ios virtual-position" aria-posinset="2" aria-setsize="2" style="transform: translate3d(0px, 44px, 0px);">

滚动列表后，其高度已正确计算，尽管这不再是使用近似尺寸进行初始计算的结果，但此时元素已经初始化，所有内容均根据其实际渲染大小进行计算。

目前我找到的唯一解决方案是通过 css 为列表元素定义 min-height，虽然我不确定这是否是一个合适的解决方案，以及它是否会在未来导致问题。

你能帮我理解发生了什么吗？

Answer 1

Ionic document:

每个模板的大致宽度和高度用于帮助 确定应该创建多少个单元格，并帮助计算 可滚动区域的高度。

我们可以理解，大概的宽度和高度并不是用来固定物品的大小的。所以如果你想确定每个项目的大小，只需在 css 中进行即可。