vue开发webapp监听手机返回和退出

之前做webapp时学到的：使用 mui 进行手机物理键的监听

首先安装 mui

npm i vue-awesome-mui

然后在 main.js 里注册

import Mui from 'vue-awesome-mui';
Vue.use(Mui);

index.html 里：

<script type="text/javascript">
  mui.init({
    keyEventBind: {
      backbutton: true, //关闭back按键监听
    }
  })
  //首页返回键处理
  // 处理逻辑： 1s内，连续两次按返回键，则退出应用；
  var first = null;
  mui.back = function(){
    // 首次按键， 提示 再按一次退出应用
    if(!first){
      first = new Date().getTime();//记录第一次按下回退键的时间
      mui.toast("再按一次退出应用");
      history.go(-1); // 回退到上一页
      setTimeout(function(){
        //1s 后清除
        first = null;
      }, 1000);

    }else{
      if(new Date().getTime() - first < 1000){
        //如果两次按下的时间小于1s
        plus.runtime.quit(); //那么就退出app
      }
    }
  }
</script>