ionic 4防止/禁用设备硬件后退按钮

Question

我对ionic 4项目使用了角路由（@ angular / router）以禁用ionic 4中的设备后退按钮prevent-default不起作用，下面是我的代码

app.component.ts

    this.platform.backButton.subscribe(() => {
        if (this.router.url === '/Login') {
          this.util.presentAppExitAlert();
        } else {
          // event.preventDefault();
          console.log("invoing url ", this.router.url);
        }
      });
    });

我无法在此处禁用设备后退按钮的任何帮助

Answer 1

更新

听众backButton已经转向 RxJS observables 哲学，所以现在做得有点不同：

const backButtonSubscription = this.platform.backButton
        .subscribeWithPriority(9999, () => {
              // Do my stuff on back button tap
        }));

...

// Now I want to return back button to previous state
backButtonSubscription.unsubscribe();

也许您想backButtonSubscription为您的类创建一个属性，以便您可以在其他类函数中访问它。

原来的

我找到了如何撤消它（返回按钮以前的功能）：

您的观察者被推入this.platform.backButton.observers数组。所以你只需要弹出列表的最后一个元素：

this.platform.backButton.observers.pop();

希望它对某人有帮助。

Answer 2

initializeApp() {
    this.platform.ready().then(() => {
      this.platform.backButton.subscribeWithPriority(9999, () => {
        document.addEventListener('backbutton', function (event) {
          event.preventDefault();
          event.stopPropagation();
          console.log('hello');
        }, false);
      });
      this.statusBar.styleDefault();
    });
  }

Answer 3

2020年5月2日

\n\n

这对我有用。

\n\n

应用程序组件.ts

\n\n

\xc2\xa0\xc2\xa0

\n\n

async\xc2\xa0initializeApp():\xc2\xa0Promise<void>\xc2\xa0{\n\xc2\xa0\xc2\xa0\xc2\xa0\xc2\xa0await\xc2\xa0this.platform.ready();\n\xc2\xa0\xc2\xa0\xc2\xa0\n\xc2\xa0\xc2\xa0\xc2\xa0\xc2\xa0this.platform.backButton.subscribeWithPriority(1,\xc2\xa0()\xc2\xa0=>\xc2\xa0{\xc2\xa0//\xc2\xa0to\xc2\xa0disable\xc2\xa0hardware\xc2\xa0back\xc2\xa0button on whole app\n\xc2\xa0\xc2\xa0\xc2\xa0\xc2\xa0});\n\n\xc2\xa0\xc2\xa0}\n

\n