//vue钩子函数created方法中添加监听等待设备API库加载好
created(){
  var that = this;
  document.addEventListener("deviceready", that.onDeviceReady, false);
}
methods:{
//设备API可以使用了,然后在vue的methods中添加如下方法
  onDeviceReady() {
    var that = this;
document.addEventListener("backbutton", that.eventBackButton, false);
  },
  //监听返回键按钮事件
  eventBackButton(){
    var that = this;
that.$toast('再按一次退出');//这里使用的是vantUI框架的弹窗提示,此处可根据自身项目进行更改
document.removeEventListener("backbutton", that.eventBackButton, false); //注销返回键
document.addEventListener("backbutton", that.exitApp, false);//绑定退出事件
var intervalID = setInterval(() => {
  document.clearInterval(intervalID);
  document.removeEventListener("backbutton", that.exitApp, false);
  document.addEventListener("backbutton", that.eventBackButton, false);
},2000);
  },
  // 关闭app
  exitApp() {
  var that = this;
  navigator.app.exitApp();
  }
}
//页面离开时销毁监听事件
destroyed() {
  var that = this;
  document.removeEventListener("backbutton", that.exitApp, false);
  document.removeEventListener("backbutton", that.eventBackButton, false);
},

vue+cordova实现退出app效果的更多相关文章

  1. vue+cordova 构建hybrid app

    配了一个 vue + cordova + ionicCli 的 项目 支持 ionic 的脚手架命令 支持 cordova 的 插件 安装使用 支持 webpack 的自动构建 vue 安装了 vue ...

  2. Vue+cordova开发App

    Vue+cordova开发App https://www.imooc.com/article/70062

  3. vue打包成app后,点击手机上的物理返回按钮后直接退出app

    在浏览器上浏览vue项目时,后退按钮是可以正常返回上一页的,但是打包成app后,点击手机上的屋里返回按钮,就直接退出app回到桌面了, 以下是解决办法: 使用mui进行手机的物理键的监听 1.首先安装 ...

  4. iOS 之 退出app(项目)的几种方法

    路漫漫其修远兮,吾将上下而求索.也算是对程序员的一种真实写照了吧. 今天想研究一下iOS中退出项目的方法,说是今天,其实也关注并去了解很久了.只是始终找不到自己认为很好的方法.今天就先把自己了解的列举 ...

  5. 【前端】Vue和Vux开发WebApp日志一、整合vue+cordova和webpack+gulp

    转载请注明出处:http://www.cnblogs.com/shamoyuu/p/vue_vux.html 项目github地址:https://github.com/shamoyuu/vue-vu ...

  6. Android:后台给button绑定onClick事件、当返回项目到手机页面时提示是否退出APP

    上一篇文章我们学习了android通过findViewById的方式查找控件,本章将了解button控件,及btton如何绑定控件. 通过android的ui设计工具设计一个登录页面: <Rel ...

  7. vue用hbuilderX打包app嵌入h5方式云打包和遇到的问题

    vue用hbuilderX打包app嵌入h5方式云打包和遇到的问题 vue用hbuilderX打包app就可以了,不过有兼容性问题,转换rem的用不了,嵌入到app的webview里面变得很小了,另外 ...

  8. ionic 项目内部更新用到的插件,退出app插件

    一 cordova-plugin-app-version插件  用来获取APP版本 ionic plugin add cordova-plugin-app-version -----cordova-p ...

  9. vue+cordova项目

    教你用Cordova打包Vue项目   现在国内越来越多的开发者使用Vue开发混合app,但是当大家开发完成过后才发现不知道该怎么将Vue项目打包成app.据我现在的了解打包Vue项目目前流行的就是使 ...

随机推荐

  1. Linux centos7.0 配置防火墙及开放端口

    现在防火墙有两种服务1.service firewalld 2.service iptables 一.就firewalld来说查看开放的端口  netstat  -anp 查询防火墙状态  servi ...

  2. 关于Html+css阶段学习总结

    一.学习经历 进入大学不久,就加入了社团,从而对前端有了一个初步的了解,之后也做过一些学校的官网,积累了一些微小的经验. 到了大二的时候,学校开设了专门的html+css课程,从中也学到许多新的htm ...

  3. 探索 Redux4.0 版本迭代 论基础谈展望(对比 React context)

    Redux 在几天前(2018.04.18)发布了新版本,6 commits 被合入 master.从诞生起,到如今 4.0 版本,Redux 保持了使用层面的平滑过渡.同时前不久, React 也从 ...

  4. Java基础篇(01):基本数据类型,核心点整理

    本文源码:GitHub·点这里 || GitEE·点这里 一.基本类型 1.基本类型 不使用New创建,声明一个非引用传递的变量,且变量的值直接置于堆栈中,大小不随运行环境变化,效率更高.使用new创 ...

  5. Python中使用os模块执行远程命令

    1. 使用os模块远程执行命令 服务端代码 1 import socket 2 import os 3 4 sh_server = socket.socket() #创建一个socket对象 5 sh ...

  6. 【翻译】.NET 5 Preview 1 发布

    .NET 5 Preview 1 发布 去年年底,我们发布了.NET Core 3.0和3.1.这些版本添加了桌面应用程序模型Windows Forms(WinForms)和WPF,ASP.NET B ...

  7. 机器学习 - LSTM应用之情感分析

    1. 概述 在情感分析的应用领域,例如判断某一句话是positive或者是negative的案例中,咱们可以通过传统的standard neuro network来作为解决方案,但是传统的神经网络在应 ...

  8. 第一个android App, hello world

    自以为按照教程很快就会创建自己第一个android App,没想到还是用了很长时间,中间走了很多坑,记下来,这也算自己的一个成长吧 首先按照官方的教程,新建一个工程 https://developer ...

  9. js 验证输入框是否为空

    很多时候,菜鸟在对输入框是否输入值进行验证时,总会把输入“空字符串”这一状况给忽略掉.嗯,我就这样,所以记下,以后回忆下还是不错滴 <input type="text" id ...

  10. Java 14 开箱,它真香香香香

    Java 14 已经发布有一周时间了,我准备来开个箱,和小伙伴们一起来看看新特性里面都有哪些好玩的.我们程序员应该抱着尝鲜.猎奇的心态,否则就容易固步自封,技术停滞不前.先来看看 Java 14 都有 ...