Ionic 4 Angular：在使用无限刷新时是否可以在内容中拥有固定元素？

Question

考虑一个简单的 Ionic 页面的内容：

\n\n

<ion-content>\n\n    <ion-refresher slot="fixed">...</ion-refresher>\n\n    <div *ngFor="let item of items">\n        ...\n    </div>\n\n    <ion-infinite-scroll>...</ion-infinite-scroll>\n\n</ion-content>\n

\n\n

我做了一个 Stackblitz 来演示这个页面： https://stackblitz.com/edit/ionic-v4-angular-tabs-nbjk4k

\n\n

现在我想<div>Some content</div>在页面顶部或底部添加一些固定位置 \xe2\x80\x93 的内容，假设 \xe2\x80\x93 不在ion-header或ion-footer部分内。是否可以解决这个问题div以粘在顶部或底部？

\n\n

我在 Ionic 文档和 Github 上找到的官方建议是使用slot="fixed"在内容区域中使用我想要修复的任何元素。

\n\n

它不知何故对我不起作用，也许与slot="fixed"复习组件有冲突。

\n\n

如何实现固定元素？

\n

Answer 1

确实存在问题slot="fixed"，Ionic 团队为此做了一些更改。

内容（div？）需要包装在position:relative包装器中。在标签中
使用它应该可以做到这一点。position:relative例如 - <div slot='fixed' style="position:relative">Some content</div>。

关注此 PR了解更多信息。希望这可以帮助！！