码迷,mamicode.com
首页 > 移动开发 > 详细

Vue-app:物理返回键设置(单击跳转/双击退出)

时间:2019-05-27 16:25:42      阅读:706      评论:0      收藏:0      [点我收藏+]

标签:双击   按键   main   awesome   ntb   bsp   size   time   手机   

1.概述

           实现手机物理返回键的跳转逻辑:除特殊页面(例如首页、我的等一级页面),单击跳转到前一页;一级页面(除首页)单击跳转到首页;首页单击提示“在单击一次,退出app”,单击两次退出app。

2.代码步骤

         1.在main.js中

                  import Mui from ‘vue-awesome-mui‘;

       Vue.use(Mui);
        2.在index.html中   
  <script>
       mui.init({
           keyEventBind: {
                backbutton: true //关闭back按键监听
           }
       });
        // //首页返回键处理
        // //处理逻辑:1秒内,连续两次按返回键,则退出应用;
       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>

Vue-app:物理返回键设置(单击跳转/双击退出)

标签:双击   按键   main   awesome   ntb   bsp   size   time   手机   

原文地址:https://www.cnblogs.com/wjl-boke/p/10931298.html

(1)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!