触摸键盘问题，同时点击SearchBar，它滚动到顶部，对用户不可见

Question

我正在研究Ionic 3.X版本，在我的主页上我有一个搜索栏。

问题点击SearchBar时，它从底部打开键盘，我的searchBar和整个屏幕上升，用户无法在点击searchBar后查看或滚动

OS中的

问题： iOS

  

相同的代码适用于Android

屏幕截图：

搜索栏的HTML代码：

<ion-content padding class="home-content-background-color">
    <div *ngIf="headerTextShowFlag">
      <div text-center>
        <img [src]="appLogo" width="100" height="100">
      </div>
      <ion-label style="text-align: center" class="text-color">Welcome</ion-label>
      <hr class="hr-style">
      <ion-label text-wrap padding style="text-align: center" class="text-color">
        Please Enter Service Request Number</ion-label>
    </div>
    <div>
      <ion-searchbar (ionInput)="getItems($event)"></ion-searchbar>
      <ion-list style="height: 58%; overflow-y: scroll; margin: 0px">

        <ion-item *ngFor="let Case of CaseArrayFiltered" (click)="selectCaseFromList(Case)">
          {{ Case }}
        </ion-item>

      </ion-list>
    </div>

</ion-content>

首次点击搜索栏时，无法显示搜索栏，并在第一次加载时始终移出屏幕。

禁用滚动解决我的问题，但在添加以下行后，我的键盘显示/隐藏无法正常工作。

this.keyboard.disableScroll(true);

Answer 1

在上述问题上经过大量研发后，我在我的.ts文件中找到了一些代码补丁的解决方案

需要禁用键盘滚动，以便在键盘显示时我的屏幕不会自动启动。

platform.ready().then(() => {
    this.keyboard.disableScroll(true);
});

还需要在this.zone()

中更新我的旗帜

this.zone.run(() => {
    self.toggleHeader = false;
});

上面的代码行将在主线程上执行，并将更新flag＆amp;用户界面基于此我的问题已经解决，希望这将有助于其他在iOS平台上也面临同样问题的人。

感谢。