javascript - 使用Dojo SpinWheel

我正在创建一个应用程序，并希望使用Dojo中的SpinWheel小部件。

当前，我要做的只是从站点http://dojotoolkit.org/reference-guide/1.9/dojox/mobile/SpinWheel.html#id4上获取SpinWheel Widget的工作示例，

不幸的是，我似乎无法做到这一点。

我试过了：

在线使用示例中的声明性代码。我从github上提取了dojo和dojox仓库，并且知道它们在正确的位置，因为Hello Dojo教程与我的路径完美配合。代码（大部分是从网站上以粗体显示的代码）在下面。

会发生什么：Dojo代码都不起作用。标题显示，“。”显示，但没有其他显示。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Dojo SpinWheel</title>

<!-- load Dojo -->
<script src="dojo/dojo.js"
        data-dojo-config="async: true"></script>
</script>
<script>
    require([
        "dojox/mobile/parser",
        "dojox/mobile/SpinWheel"
    ]);
</script>
</head>

<body>
  <div id="view1" data-dojo-type="dojox/mobile/View">
    <h1 data-dojo-type="dojox/mobile/Heading">Custom SpinWheel</h1>
    <div id="spin1" data-dojo-type="dojox/mobile/SpinWheel">
     <div data-dojo-type="dojox/mobile/SpinWheelSlot"
         labels="['A','B','C','D','E','F','G','H','I','J','K']"
         style="text-align:center;width:40px;"></div>
     <div data-dojo-type="dojox/mobile/SpinWheelSlot"
         labelFrom="3000" labelTo="3100"
         style="width:70px;"></div>
     <div id="pt" class="mblSpinWheelSlot"></div>
     <div id="txt" class="mblSpinWheelSlot">.</div>
     <div data-dojo-type="dojox/mobile/SpinWheelSlot"
         labelFrom="0" labelTo="9"
         style="width:30px;"></div>
     <div data-dojo-type="dojox/mobile/SpinWheelSlot"
         labels="['pt','px','cm']"
         style="width:50px;"></div>
    </div>
    </div>
</body>
</html>

最佳答案

您的示例无法正常工作，因为：

您不打parser.parse()
您不需要声明式语法使用的所有模块
您不加载手机主题

假设DOJO在Apache的htdocs根目录中解压，则HTML文件的工作头应如下所示：

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <title>Dojo SpinWheel</title>
    <!-- load Dojo -->
    <script src="/dojox/mobile/deviceTheme.js"></script>
    <script src="/dojo/dojo.js" data-dojo-config="async: true"></script>
  <script type="text/javascript">
    require([
        "dojox/mobile/parser",
        "dojox/mobile/SpinWheel", "dojox/mobile/View", "dojox/mobile/Heading", "dojox/mobile/SpinWheelSlot"
    ], function(parser) {
       parser.parse();
    });
  </script>
</head>

另请参见dojox/mobile/tests下的示例。它们通常可以工作，这与Dojo在线文档中的许多示例相反：(