首页 > 解决方案 > ionic 4 - 动态改变导航过渡方向

问题描述

我希望能够动态控制导航过渡方向。

在这篇文章中,我发现了如何强制执行 android 或 ios 默认转换。

https://forum.ionicframework.com/t/page-transition-direction-in-ionic-4/148518/5

    IonicModule.forRoot({
        rippleEffect: false,
        // TODO:
        // navAnimation: override here
    }),

有没有办法在过渡开始之前从组件内部设置过渡方向?

标签: angulartransitionrouterionic4

解决方案


我已经解决了这个问题并发布了一篇中等文章

https://medium.com/@hanche2001/how-to-change-between-android-and-ios-page-transitions-dynamically-in-ionic-ec1256a692f5

TLDR

IonicModule.forRoots 允许您使用 navAnimation 函数配置和强制预定义的过渡动画

navAnimation 函数接收进入和离开页面的引用以及使用的 ion-router-outlet

您可以编写一个自定义函数来检查 ion-router-outlet 或进入页面的任何 DOM 属性,并返回您要使用的页面转换


推荐阅读