在 ion-virtual-scroll 之前添加内容时出现 ionic 4 问题答案

【问题标题】：ionic 4 problem when adding content before ion-virtual-scroll在 ion-virtual-scroll 之前添加内容时出现 ionic 4 问题
【发布时间】：2020-07-09 01:25:01
【问题描述】：

我有这段代码，使用 ionic 4 和 angular 8 可以正常工作

<ion-content>
<ion-virtual-scroll>
...
...
...
</ion-virtual-scroll>
</ion-content>

在ion-virtual-scroll 之前添加了一些内容后，这个问题就会产生成本。未在正确时间显示的项目 [参见 Gif]

<ion-content>
<div class="content-header">...</div>
<ion-virtual-scroll>
...
...
...
</ion-virtual-scroll>
</ion-content>

当我 display:none 班级 .content-header 它再次正常工作。

问：

有没有办法让 ion-virtual-scroll 在屏幕上加载更多内容？

有没有办法在向下滚动后隐藏 .content-header（可能有效）？

【问题讨论】：

您是否使用页眉边距？如果是这样，请为 vitualscroll=> margin-botto:-margin 从 div header 设置相同的边距
或者如果不分享你添加的标题的css
是的，它有一个margin-bottom：6em；我会试试你的答案
欧巴，已经解决了，但是没有任何边距，只是整理了页面上的div，我会往下加屏幕

标签： angular ionic-framework ionic4

【解决方案1】：

当我写这个问题时，我并没有想到某些没有任何 CSS 的 div 会导致这个问题，但确实如此。

这个截图有问题

更改为此顺序后，<ion-virtual-scroll> 可以正确检测到高度。 .

我希望它很清楚。它只是被删除了<div class="ion-padding">

【讨论】：