首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >使用设备上的android按钮返回到Framework7应用程序的主视图?

使用设备上的android按钮返回到Framework7应用程序的主视图?
EN

Stack Overflow用户
提问于 2016-06-02 12:36:16
回答 6查看 14.1K关注 0票数 11

我最近用framework7和cordova开发了一个应用程序。我的应用程序由一个html文件组成,其中包含所有视图。若要在视图之间导航,每个子视图的顶部都会出现一个后退按钮。

如果有人按下设备上的后退按钮,应用程序将被关闭。

当我在子页面中时,如何使用后退按钮到达主页面?

我读过framework7网站上的路由器API,但它确实令人困惑,而且似乎不起作用。以下是我正在尝试的:

代码语言:javascript
运行
复制
<html>
  <head>...</head>
  <body>
    ...
    <!-- Views -->
    <div class="views">
      <!-- View -->
      <div class="view view-main">
        <!-- Pages -->
        <div class="pages">
          <!-- Home page -->
          <div class="page" data-page="index">
            <div class="page-content">
              <p>Home page</p>
            </div>
          </div>

          <!-- About page -->
          <div class="page cached" data-page="about">
            <div class="page-content">
              <p>About page</p>
            </div>
          </div>

          <!-- Services page -->
          <div class="page cached" data-page="services">
            <div class="page-content">
              <p>Services page</p>
            </div>
          </div>
        </div>
      </div>
    </div>
    ...
  </body>
</html>

// Initialize App  
var myApp = new Framework7();

// Initialize View          
var mainView = myApp.addView('.view-main')          

// Load about page:
mainView.router.load({pageName: 'about'});

请注意,当我在另一个div中时,我想使用设备上的物理按钮导航到主视图。

请帮帮忙。

EN

回答 6

Stack Overflow用户

回答已采纳

发布于 2016-06-04 06:37:41

如果您只想导航到后台页面,请在应用程序初始化中使用pushState : true,则可以使用framework7中的“硬件后退”按钮返回。如果要打开特定页面,则mainView.router.load是framework7中的一个函数。您可以在路由器上进行验证,以检查页面是否是您的mainView page.By,这样您就可以控制退出的app.when后台页面加载,它调用了路由器,路由器给出了有关页面(即:page.namepage.query )的详细信息。希望这能有所帮助

票数 8
EN

Stack Overflow用户

发布于 2017-10-06 07:02:21

你好,各位开发人员,

我知道每个人都对framework7中的安卓硬件back按钮问题感到非常恼火,而找到一个解决方案也是非常乏味的,因为我一直在努力。所以这里有代码片段,它将帮助您管理android设备上的所有硬件回键问题(弹出、调制解调器、弹出、侧面板和应用程序退出)。如果有任何混淆,请检查代码并删除查询。

器件就绪功能

代码语言:javascript
运行
复制
function onDeviceReady() {
    document.addEventListener('backbutton', onBackKeyDown, false);
}

function onBackKeyDown() {
    var cpage = mainView.activePage;
    var cpagename = cpage.name;
    console.log(cpagename);
    if (($$('#leftpanel').hasClass('active')) || ($$('#rightpanel').hasClass('active'))) { // #leftpanel and #rightpanel are id of both panels.
        myApp.closePanel();
        return false;
    } else if ($$('.modal-in').length > 0) {
        myApp.closeModal();
        return false;
    } else if (cpagename == 'index') {
        myApp.confirm('Are you sure you want to exit?', function() {
            // var deviceType = device.platform;
            // if(deviceType == “Android” || deviceType == “android”){
            navigator.app.exitApp();
            // }
        },
        function() {
        });
    } else {
        mainView.router.back();
    }
}
票数 9
EN

Stack Overflow用户

发布于 2017-09-04 20:17:34

要向后导航,请转到步骤1. my-app.js step2。粘贴以下内容:

代码语言:javascript
运行
复制
// Initialize your app
var myApp = new Framework7({pushState: true,});

再次运行你的应用程序。希望这能有所帮助

票数 4
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/37592068

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档