ionic-framework - 从第 2 页导航到第 1 页时页脚可见

Question

从 page1 导航到 page2 然后从 page2 导航回 page1 时，ion-footer 按钮没有正确消失。

这是 page2 中的代码:

<ion-footer padding>
  <button ion-button block round color="primary">Add to Order</button>
</ion-footer>

我在 github 上发现了一个完全相同的问题，建议添加标签 ion-toolbar 但它对我不起作用:

ion-footer on back should disappear on willLeave not didLeave

Footer Visible During Navigation Transition

Nav animations for ion-footer-bar and ion-header-bar

欢迎任何评论/回答!

Answer 1

创建一个新类，比如 .app-footer，使用与 ion-footer 相同的 CSS 属性，并将 HTML 放在 ion-content，像这样:

HTML

<ion-content>
  <page code>
  <div class="app-footer">...</div>
</ion-content>

SCSS

.app-footer {
  left: 0;
  bottom: 0;
  position: absolute;
  z-index: 10;
  display: block;
  width: 100%;
}