0

目標: dojox.mobile.View を継承する別個のテンプレートを使用して Dojo ウィジェットを作成したいと考えています。

//Javascript
define([
"dojo/_base/declare",
"dijit/_TemplatedMixin", 
"dijit/_WidgetsInTemplateMixin",
"dojo/text!./templates/myAppview.html",
"dojox/mobile", "dojox/mobile/deviceTheme", "dojox/mobile/compat",
"require",
"dojox/mobile/ListItem",
"dojox/mobile/Heading"],
function (declare, _TemplatedMixin, _WidgetsInTemplateMixin, template, mobile, deviceTheme, compat, require) {
    return declare("widgets.myApp.myAppView", [dojox.mobile.View, _TemplatedMixin, _WidgetsInTemplateMixin], {
    templateString: template,
    widgetsInTemplate: true,
    widgetBase: require.toUrl("widgets/myApp/"),
    constructor: function (params) {
        params = params || {};
        console.log("constructor" + dojo.toJson(params));
    },
    startup: function () {
        this.inherited(arguments);
    },
    postCreate: function () {
        this.inherited(arguments);
    }
});
});

テンプレート

<div>
    <div data-dojo-type="dojox/mobile/Heading" data-dojo-props="label: 'Templated View'">
    </div>
</div>

使用法

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body>
    <script type="text/javascript" charset="utf-8" src="globals.js"></script>
    <script type="text/javascript" charset="utf-8" src="//ajax.googleapis.com/ajax/libs/dojo/1.8.3/dojo/dojo.js"></script>
    <script type="text/javascript">
        require([
            "dojo/parser",
            "widgets/myApp/myAppView",
            "dojo/domReady",
            "dojox/mobile", "dojox/mobile/deviceTheme", "dojox/mobile/compat"
        ],
            function (parser, myApp, ready) {
                parser.parse();
                myApp = new widgets.myApp.myAppView();
                myApp.placeAt("kj");
                myApp.startup();
             });

    </script>

    <div id="kj">
    </div>

    <!--Crash-->
    <div data-dojo-type="widgets.myApp.myAppView">
    </div>
</body>
</html>

プログラムでウィジェットを作成すると起動しますが、テンプレートが含まれていません。<div data-dojo-type="widgets.myApp.myAppView">フリーズしたまま作成すると。

単純に dojox.mobile.View を継承し、postCreate で他のウィジェットをプログラムで追加すると、すべてが機能します。ただし、構造を維持しやすくするためには、dojox.mobile.View を継承し、テンプレートを mixin できるようにする必要があります。

4

1 に答える 1