选项卡在 Dojo 应用程序中不起作用答案

【问题标题】：Tabs not working in a Dojo app选项卡在 Dojo 应用程序中不起作用
【发布时间】：2015-04-12 19:51:37
【问题描述】：

我正在尝试使用 Dojo 工具包在 Eclipse Juno 上的 IBM MobileFirst Platform 上的混合应用程序中创建多个页面。

在设计视图中：首页以外的页面中的文字不出现。

运行和部署所有环境后，我在浏览器（chrome）上预览，标签不起作用

<!DOCTYPE HTML>
<html>
<head>
        <meta charset="UTF-8">
        <title>MoodApp</title>
        <meta name="viewport"
         content="width=device-width, initial-scale=1, maximum-scale=1, user- scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
        <link rel="stylesheet" href="css/main.css">
        <script>window.$ = window.jQuery = WLJQ;</script>
        <script type="text/javascript" src="dojox/mobile/deviceTheme.js"></script>
        <script type="text/javascript" data-dojo-config="isDebug: false, async: true, parseOnLoad: true, mblHideAddressBar: false" src="dojo/dojo.js"></script>
    </head>


    <body style="display: none;">

<div data-dojo-type="dojox.mobile.View" id="view0" data-dojo-props="selected:false">
    <div data-dojo-type="dojox.mobile.Heading" data-dojo-props="label:'My Mood App'">
    </div>
    <ul data-dojo-type="dojox.mobile.TabBar" fixed="bottom">
        <li data-dojo-type="dojox.mobile.TabBarButton" data-dojo-props="moveTo:loginPage,transition:'slide',icon:'images/done.png'">Log in</li><li
            data-dojo-type="dojox.mobile.TabBarButton" data-dojo-props="moveTo:signupPage,icon:'images/comments16.png',transition:'slide'">Sign up</li>
    </ul>

    <div data-dojo-type="dojox.mobile.View" id="loginPage" data-dojo-props="selected:true">Enter username and password</div>
    <div data-dojo-type="dojox.mobile.View" id="signupPage" data-dojo-props="selected:false">sign up now</div>


</div>




<script src="js/initOptions.js"></script>
        <script src="js/main.js"></script>
        <script src="js/messages.js"></script>
    </body>

【问题讨论】：

此错误是否与预览问题有关？？服务器“MobileFirst Development Server”无法启动。
不，错误之间没有关系。
那么如何预览、运行或模拟以查看工作选项卡？我的环境是android @idan Adar
查看控制台 > MobileFirst Development Server 日志。你在那里看到什么？或者只是尝试一个新的工作空间。顺便说一句，您说您已经在浏览器中预览了该应用程序 - 如果服务器未运行，您是如何做到的。 ...
实际上我看到所有都在 mobilefirst 开发服务器下启动和同步.. 我什至尝试将我的 IP 地址而不是 localhost

标签： android eclipse dojo ibm-mobilefirst

【解决方案1】：

Eclipse Juno 不是 IBM MobileFirst Platform 中受支持的 Eclipse 版本 - 升级到 Eclipse Java EE Kepler 或 Luna。

您的标签不起作用，因为您没有将 moveTo 值放在单引号中：

<ul data-dojo-type="dojox.mobile.TabBar">
    <li data-dojo-type="dojox.mobile.TabBarButton" data-dojo-props="moveTo:'loginPage',transition:'slide',icon:'images/done.png'">Login</li>
    <li data-dojo-type="dojox.mobile.TabBarButton" data-dojo-props="moveTo:'signupPage',icon:'images/comments16.png',transition:'slide'">Signup</li>
</ul>

更完整的例子：

<div data-dojo-type="dojox.mobile.View" id="view0" data-dojo-props="selected:false">
    <div data-dojo-type="dojox.mobile.Heading" data-dojo-props="label:'My Mood App'">
    </div>

    <p>
        This is view 0.<br/>
        This is view 0.<br/>
        This is view 0.<br/>
    </p>

    <ul data-dojo-type="dojox.mobile.TabBar">
        <li data-dojo-type="dojox.mobile.TabBarButton" data-dojo-props="moveTo:'loginPage',transition:'slide',icon:'images/done.png'">Login</li>
        <li data-dojo-type="dojox.mobile.TabBarButton" data-dojo-props="moveTo:'signupPage',icon:'images/comments16.png',transition:'slide'">Signup</li>
    </ul>
</div>

<div data-dojo-type="dojox.mobile.View" id="loginPage" data-dojo-props="selected:false">
    <div data-dojo-type="dojox.mobile.Heading" data-dojo-props="label:'My Mood App'">
    </div>
    Enter username and password
</div>

<div data-dojo-type="dojox.mobile.View" id="signupPage" data-dojo-props="selected:false">
    <div data-dojo-type="dojox.mobile.Heading" data-dojo-props="label:'My Mood App'">
    </div>

    sign up now
</div>

【讨论】：