OnsenUI onresume重新加载应用程序

时间:2016-04-09 15:40:46

标签: cordova onsen-ui monaca

我的应用有3个标签,我想将用户返回到初始屏幕或简历上的特定标签,以便我可以确保我拥有用户的地理位置。这就是我的尝试:

 // Wait for device API libraries to load
function onLoad() {
    document.addEventListener( "deviceready", onDeviceReady, false );
}

// device APIs are available
function onDeviceReady() {
    document.addEventListener( "resume", onResume, false );
}

// Handle the resume event
function onResume() {
    tabbar.setIndex( 1 );
    modal.show();
    getUsersLocation( getEstablishments );
}

1 个答案:

答案 0 :(得分:0)

此代码已经在Android上的Monaca调试器中进行了测试,并且工作正常。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="mobile-web-app-capable" content="yes" />
    <meta http-equiv="Content-Security-Policy" content="default-src * data:; style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'">
    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
    <link href='https://fonts.googleapis.com/css?family=Roboto:400,300italic,300,400italic,500,700,700italic,500italic' rel='stylesheet' type='text/css'>
    <title>Onsen UI Forum Help by Munsterlander</title>

    <link rel="stylesheet" href="https://cdn.rawgit.com/OnsenUI/OnsenUI-dist/2.0.0-beta.8/css/onsenui.css" type="text/css" media="all" />
    <link rel="stylesheet" href="https://cdn.rawgit.com/OnsenUI/OnsenUI-dist/2.0.0-beta.8/css/onsen-css-components.css">
    <script src="https://cdn.rawgit.com/OnsenUI/OnsenUI-dist/2.0.0-beta.8/js/onsenui.js"></script>
    <script src="components/loader.js"></script>

    <script>
        document.addEventListener( "resume", function(e) {
            alert("You're back!");
            document.getElementById('myNav').setActiveTab(2);
        });
    </script>    
</head>

<body>

<ons-tabbar id="myNav">
  <ons-tab page="home.html" active="true">
    <ons-icon icon="ion-home"></ons-icon>
    <span style="font-size: 14px">Home</span>
  </ons-tab>
  <ons-tab page="fav.html">
    <ons-icon icon="ion-star"></ons-icon>
    <span style="font-size: 14px">Favorites</span>
  </ons-tab>
  <ons-tab page="settings.html">
    <ons-icon icon="ion-gear-a"></ons-icon>
    <span style="font-size: 14px">Settings</span>
  </ons-tab>
</ons-tabbar>
<ons-template id="home.html">
  <p>Home</p>
</ons-template>
<ons-template id="fav.html">
  <p>Fav</p>
</ons-template>
<ons-template id="settings.html">
  <p>Settings</p>
</ons-template>

</body>
</html>

我要说的唯一的怪癖就是调试应用程序本身,如果这是您用于测试的。要触发事件,您需要打开另一个应用程序,这样当您转到打开的窗口时,调试器不是堆栈中的第一个。如果是第二个,则事件会毫无问题地触发。