【问题标题】:Cordova android backbutton confirmation messageCordova android后退按钮确认消息
【发布时间】:2018-09-05 16:50:39
【问题描述】:

我正在与 Monaca 和 onsen.ui 一起使用基于 Cordova 的 vue.js 相关应用程序。我需要处理 Android 后退按钮,以便在用户按下手机的后退按钮时向我显示确认消息。它必须显示两个选项“是”和“否”。如果用户按“是”,则用户将离开应用程序,否则将留在应用程序中。由于我是 Vue.js 的新手,请帮助我找到在 vue.js 中实现它的解决方案。我已经尝试过 StackOverflow 中可用的其他解决方案,但似乎没有任何效果。我会很感激你的帮助。

mounted(){
            document.addEventListener('backbutton', this.onBackKeyDown, false);

        },
methods{
 onBackKeyDown:  function  (e) {
                    e.preventDefault();
                    alert('Back Button is Pressed!');
                    navigator.notification.confirm("Are you sure you want to exit ?",this.onConfirm(), "Confirmation", "Yes,No");
                    // Prompt the user with the choice
                },
                onConfirm: function (button) {
                    if (button === 2) {
                        return;
                    } else {
                        navigator.app.exitApp();
                    }
                },
}

【问题讨论】:

  • 请发布您已经尝试过的内容。如果没有展示我们可以帮助解决的当前工作,您基本上是在说“编写我的代码”,而这不是 SO 的用途。
  • 对不起。已更新问题。
  • 问题是你试图在 deviceready 事件触发之前附加后退按钮事件。

标签: javascript cordova vue.js monaca


【解决方案1】:

不管你用的是哪个js。如果要实现上述要求,则需要安装以下插件。

cordova plugin add cordova-plugin-dialogs

示例代码如下

document.addEventListener("deviceready", onDeviceReady, false);
 function onDeviceReady(){
         document.addEventListener("backbutton", function(e){
        navigator.notification.confirm("Are you sure you want to exit the application?",fnLogout,"Warning","Ok,Cancel"); // u can change the button names in the place of ok,cancel.
    }, false); 
}

function fnLogout(button) {
    if(button == 1) {
        navigator.app.exitApp(); //exit from the if presses "ok"
    } else {
        return; //No action if presses "cancel"
    }                     
 }

【讨论】:

  • 我已经在我的代码中添加了您的解决方案并安装了插件,但是在浏览器中当我按下退出按钮时它只会返回而不显示任何消息。请帮忙。
  • 当 SO 有聊天选项时为什么要发送电子邮件? @naresh-kumar
猜你喜欢
  • 2021-10-25
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2017-05-09
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多