调用dojo自定义小部件

时间:2016-11-23 00:19:35

标签: dojo

我创建了一个dojo自定义模板化小部件

define([ "dojo/_base/declare", "checkAppICNPluginDojo/common/ServiceUtils",
        "checkAppICNPluginDojo/p8ICNpages/CheckAppQueueData",
        "checkAppICNPluginDojo/p8ICNpages/MainStepProcessor",
        "checkAppICNPluginDojo/p8ICNpages/DashBoardScreenData",
        "checkAppICNPluginDojo/common/CheckAppConstants", "ecm/model/Request",
        "dojo/_base/lang", "dijit/layout/ContentPane", "dijit/registry",
        "dojo/dom", "dojox/grid/TreeGrid", "dijit/tree/ForestStoreModel",
        "dojo/data/ItemFileWriteStore", "dijit/layout/BorderContainer",
        "dijit/layout/TabContainer","dijit/_Widget","dijit/_TemplatedMixin", "dijit/_WidgetsInTemplateMixin" , "dijit/_WidgetBase","dojo/text!../templates/CheckAppMainPage.html"],

function(declare, ServiceUtils, CheckAppQueueData, MainStepProcessor,
        DashBoardScreenData, CheckAppConstants, Request, lang, ContentPane,
        registry, dom, TreeGrid, ForestStoreModel, ItemFileWriteStore,
        BorderContainer, TabContainer,_Widget,_TemplatedMixin,_WidgetsInTemplateMixin,_WidgetBase,template) {

    declare("checkAppICNPluginDojo.p8ICNPages.CheckAppMainPage",[_Widget,_TemplatedMixin,_WidgetsInTemplateMixin,_WidgetBase],{
        templateString : template,
        widgetsInTemplate: true,
         constructor: function () {
            },
        postMixInProperties : function() {
            alert("3");
        },
        postCreate : function() {
            alert("2");
        },
        CheckAppMainPage:function(){
            alert("1");
        }

    })

});

template is 

<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>CheckApp Main</title>
</head>
<body>
<div id="chkappmainpage">
 <div data-dojo-type="dijit/layout/BorderContainer" style="width: 100%; height: 100%;">
    <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'top'">Top pane</div>
    <div data-dojo-type="dijit/layout/AccordionContainer" data-dojo-props="region:'leading'">
        <div data-dojo-type="dijit/layout/AccordionPane" title="pane #1">accordion pane #1</div>
        <div data-dojo-type="dijit/layout/AccordionPane" title="pane #2">accordion pane #2</div>
        <div data-dojo-type="dijit/layout/AccordionPane" title="pane #3">accordion pane #3</div>
    </div>
    <div data-dojo-type="dijit/layout/TabContainer" data-dojo-props="region:'center'">
        <div data-dojo-type="dijit/layout/ContentPane" title="tab #1">tab pane #1</div>
        <div data-dojo-type="dijit/layout/ContentPane" title="tab #2">tab pane #2</div>
        <div data-dojo-type="dijit/layout/ContentPane" title="tab #3">tab pane #3</div>
    </div>
    <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'trailing'">Trailing pane</div>
    <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'bottom'">Bottom pane</div>
</div>

</div>
</body>
</html>

现在我正在尝试从javascript调用上面的自定义小部件,如下所示

define(
        [ "dojo/_base/declare", "checkAppICNPluginDojo/common/ServiceUtils",
                "checkAppICNPluginDojo/p8ICNpages/CheckAppQueueData",
                "checkAppICNPluginDojo/p8ICNpages/MainStepProcessor",
                "checkAppICNPluginDojo/p8ICNpages/DashBoardScreenData",
                "checkAppICNPluginDojo/common/CheckAppConstants",
                "ecm/model/Request", "dojo/_base/lang",
                "dijit/layout/ContentPane", "dijit/registry", "dojo/dom",
                "dojox/grid/TreeGrid", "dijit/tree/ForestStoreModel",
                "dojo/data/ItemFileWriteStore", "dijit/layout/BorderContainer",
                "dijit/layout/TabContainer","checkAppICNPluginDojo/p8ICNpages/CheckAppMainPage" ],

        function(declare, ServiceUtils, CheckAppQueueData, MainStepProcessor,
                DashBoardScreenData, CheckAppConstants, Request, lang,
                ContentPane, registry, dom, TreeGrid, ForestStoreModel,
                ItemFileWriteStore, BorderContainer, TabContainer,CheckAppMainPage) {
            this.queueName;
            this.dashBoardRowData;
            var dashBoradScreen;

            return declare(
                    "checkAppICNPluginDojo.cafeature.DashboardScreen",
                    [ TreeGrid ],
                    {

                        content : "<span class='ca-screen-Header'>Dashboard</span><br/><br/>",
                        init : function(featureObj, navManager) {


                            this.test = new CheckAppMainPage();
                        }
                    }
                            );
                });

但是我收到一个错误,因为CheckAppMainPage不是构造函数。请帮忙

1 个答案:

答案 0 :(得分:0)

在窗口小部件定义中,您需要返回窗口小部件类:

return declare("checkAppICNPluginDojo.p8ICNPages.CheckAppMainPage", [_Widget,_TemplatedMixin,_WidgetsInTemplateMixin,_WidgetBase],{
   // ...
});