首页 > 解决方案 > Ionic ion-footer 将键盘向上推

问题描述

我在Ionic的应用程序中有一个ion-footer,但我遇到了一个问题,每次键盘出来时,页脚都会被向上推。我添加了:

配置 XML

<preference name="KeyboardResize" value="false" />
<preference name="KeyboardResizeMode" value="ionic" />


<ion-footer class="ion-no-border" slot="fixed">
  <ion-grid class="footer-tab">
    <ion-row justify-content-around>

      <ion-col>
        <ion-button expand="block" fill="clear" [routerLink]="['/inicio']">
          <ion-icon color="medium" name="home"></ion-icon> 
        </ion-button>
        Início
      </ion-col>

      <ion-col>
        <ion-button expand="block" fill="clear" [routerLink]="['/extrato']"> 
          <ion-icon color="medium" name="list"></ion-icon> 
        </ion-button>
        Abastecimento
      </ion-col>

      <ion-col>
        <ion-button expand="block" fill="clear" [routerLink]="['/indicacoes']"> 
          <ion-icon color="medium" name="happy"></ion-icon> 
        </ion-button>
        Indique
      </ion-col>

      <ion-col>
        <ion-button expand="block" fill="clear" [routerLink]="['/rede']"> 
          <ion-icon color="success" name="pin"></ion-icon> 
        </ion-button>
        Postos

      </ion-col>

    </ion-row>
  </ion-grid>
</ion-footer>

CSS

  .footer-tab {
      font-size: 12px;
      text-align: -webkit-center;
      margin-top: -11px;
      margin-bottom: 2vh;
      color: grey;
    }

[屏幕截图键盘向上推]

https://i.stack.imgur.com/ORiA2.jpg

标签: ionic-frameworkkeyboardionic4

解决方案


推荐阅读