Ionic 4:硬件后退按钮重新加载应用程序

时间:2019-08-23 14:42:42

标签: android angular ionic-framework ionic4

处理项目并陷入问题:

硬件后退按钮重装应用程序(我在此应用程序中使用Angular Router)。

我退出应用程序的代码:

  ionViewDidEnter(){
      this.subscription = this.platform.backButton.subscribe(()=>{
          navigator['app'].exitApp();
      });
  }

  ionViewWillLeave(){
        this.subscription.unsubscribe();
  }

虽然逻辑相同,但可以在其他应用程序中使用。但在此应用程序中,重新加载应用程序不会退出它。

P.S:我也尝试过将其放入platform.ready(),但没有运气。

4 个答案:

答案 0 :(得分:3)

使用 IONIC 4 ,开发了一种新方法subscribeWithPriority来处理软后退和硬后退按钮之间的竞争。尝试如下修改您的代码:

 this.platform.backButton.subscribeWithPriority(1, () => {
        navigator['app'].exitApp();
 });
  

subscribeWithPriority()在事件执行后停止传播,如果我们以较高的优先级订阅并执行我们偏爱的导航而不是默认导航,那么它将按您希望的那样工作。

更多参考文档以获取详细信息:
https://github.com/ionic-team/ionic/commit/6a5aec8b5d76280ced5e8bb8fd9ea6fe75fe6795
https://medium.com/@aleksandarmitrev/ionic-hardware-back-button-nightmare-9f4af35cbfb0

更新

  • 尝试使用这个新版本的exitApp cordova plugin。我还没 尝试过我自己,但受欢迎程度看起来很有希望。
  • 也尝试从Navcontroller中清空页面堆栈或转到主屏幕,这似乎正在使用侧面菜单和标签页... this.navCtrl.pop() / this._navCtrl.navigateBack('HomeScreen')来重新加载应用程序,然后调用exitApp

注意:标签和边栏菜单,因为它们具有自己的路由模块,确实会给应用程序导航带来很多复杂性。

答案 1 :(得分:2)

已解决:

Sidep /选项卡的@rtpHarry模板中的

所提及的内容具有“历史记录”,可导致应用程序在根页面上自行重新加载。我可以通过清除历史记录来解决此问题。

ionViewDidEnter(){
  navigator['app'].clearHistory();    
}
只需清除根目录上的

即可清除历史记录,并且“硬件后退”按钮将关闭应用程序,而不是重新加载它。

答案 2 :(得分:1)

您的应用中是否有侧边菜单?我很好奇,因为这似乎也是我遇到这个问题的时候。

如果您查看检查器,您将看到window.history的长度为1。

我在某些应用程序中没有看到它,但是具有侧面菜单设置的应用程序以这种方式起作用-如果在主页上按回去,屏幕变白,然后重新加载该应用程序。

就像我说的那样,在检查器中查看时会发现有一个要回溯的历史,它正在尝试这样做,而无论那个历史回溯是什么,它只是将其推回首页,这让我感到奇怪如果是侧面菜单,则设置它自己的导航系统控件。

我可能已经说了一些措辞不佳的术语,但由于我自己还没有解决,我想我只是让您知道我所发现的...希望它可以帮助您前进。

在我的情况下,我什至没有尝试退出后台代码-我只是注意到,如果我不断按一下,该应用程序似乎会“重启”。

答案 3 :(得分:0)

这说明了Ionic 5(我认为也是4.6+)的解决方案。

private backButtonSub: Subscription;

ionViewDidEnter() {
  this.backButtonSub = this.platform.backButton.subscribeWithPriority(
    10000,
    () => {
        // do your stuff
    }
  );
}

ionViewWillLeave() {
  this.backButtonSub.unsubscribe();
}

还保留

IonicModule.forRoot({
  hardwareBackButton: true
}),

true中的app.module.ts(默认)

来源: