将离子搜索栏位置固定在顶部

Question

在ionic 4应用程序中，我使用ion-searchbar搜索或筛选了用户列表。但是如果我滚动列表，ion-searchbar也随着列表一起移动。我们可以在不编写任何css的情况下在顶部固定ion-searchbar位置修复程序吗（我们有内置属性吗？）。

Answer 1

您可以像这样放置标题。

<ion-header>
 <ion-searchbar></ion-searchbar>
</ion-header>

Answer 2

如果适合您的用例，则可以使用列表项分隔符来实现：

<ion-list>
    <ion-item-divider sticky style="border: 0">
      <ion-searchbar></ion-searchbar>
    </ion-item-divider>
    <ion-item *ngFor="let item of [0,1,2,3,4,5,6,7,8 ,9,10,11]">I am item #{{item}}</ion-item>
</ion-list>

简而言之，这将使您的搜索栏保持在视图中，同时可以滚动列表。

另一种方法（我认为更合适）是将其添加到页眉或页脚中。