代码之家  ›  专栏  ›  技术社区  ›  Marco

当放置在非活动的accordion容器中时,Dojo小部件没有正确呈现

  •  1
  • Marco  · 技术社区  · 6 年前

    我有一个web应用程序使用ArcGIS JS API和一堆自定义小部件。 如果我放一个 esri/dijit/editing/TemplatePicker 在Accordion容器选项卡(该选项卡处于非活动状态)内的ContentPane中,加载页面时,模板选取器无法正确呈现。

    1. 负载小提琴( http://jsfiddle.net/n9jwtgko/1/ )
    2. 切换到第一个手风琴窗格。小部件只是一个没有内容的边框
    3. 现在按设置更改选定窗格 selected="true"

      <div data-dojo-type="dijit/layout/ContentPane" title="Heeh, this is a content pane" selected="true">
          <div id="templatePickerDiv"></div>
      </div>
      
    4. selected=“真” 从第二个容器
    5. 提琴

    小部件现在可以正确加载了。

    这里到底发生了什么,我该怎么解决?

    3 回复  |  直到 6 年前
        1
  •  2
  •   Muhammet Can TONBUL    6 年前

    有时当我使用“道场”时,我会改变事情和工作,但我不知道为什么。它是这样工作的。“parse.parse()”部分在代码结束后运行。

    Here is fiddle

    parser.parse();
    
        2
  •  1
  •   bajji    6 年前

    <div hidefocus="hidefocus" role="grid" dojoattachevent="onmouseout:_mouseOut" tabindex="0" class="dojoxGrid grid" id="dojox_grid_DataGrid_0" align="left" widgetid="dojox_grid_DataGrid_0" aria-readonly="true" style="height: auto; width: 1px; user-select: none;">
        <div class="dojoxGridMasterHeader" dojoattachpoint="viewsHeaderNode" role="presentation" style="display: block; height: 0px;"><div class="dojoxGridHeader" dojoattachpoint="headerNode" role="presentation" style="display: none; width: 0px; left: 1px; top: 0px;">
            <div dojoattachpoint="headerNodeContainer" style="width:9000em" role="presentation">
                <div dojoattachpoint="headerContentNode" role="row"><table class="dojoxGridRowTable" border="0" cellspacing="0" cellpadding="0" role="presentation"><tbody><tr><th tabindex="-1" aria-readonly="true" role="columnheader" id="dojox_grid_DataGrid_0Hdr0" class="dojoxGridCell " idx="0" style="width:6em;"><div class="dojoxGridSortNode">cell0</div></th><th tabindex="-1" aria-readonly="true" role="columnheader" id="dojox_grid_DataGrid_0Hdr1" class="dojoxGridCell " idx="1" style="width:6em;"><div class="dojoxGridSortNode">cell1</div></th></tr><tr><th tabindex="-1" aria-readonly="true" role="columnheader" id="dojox_grid_DataGrid_0Hdr2" colspan="2" class="dojoxGridCell " idx="2" style=""><div class="dojoxGridSortNode">groupName</div></th></tr></tbody>
    
        3
  •  1
  •   Marco    6 年前

    问题似乎真的不是模板选取器就是手风琴。如果我从应用程序中删除任何一个,它都可以正常工作,所以我的计划是确保解析器只在所有事情都完成之后运行,包括 layers-add-result .

    由于我的应用程序已经模块化为mapLoader、小部件、服务等等,我决定将mapLoader重构为一个延迟对象。

    define([/*...*/, function(){
        var init = function() {
           return $.when(function(){
                     //bootstrap map
                     //bootstrap widgets
                     //create new Deferred object
                     var dfd = $.Deferred();
                     function initEditing() {
                        /*hook up the rest*/
                        //resolve promise once the templatepicker is up and running
                        dfd.resolve();
                     }
                     //return promise
                     return dfd.promise();
                  })
        };
        return {init: init}
    }])
    

    define([
        "dojo/parser",
        "app/components/mapLoader.public",
        "dojo/domReady!"
    ], function (parser, MapLoader
    ) {
         //entry point into the application
         //authentication, configuration etc. omitted
    
         MapLoader.init().done(function () {
            parser.parse();
         });
    });
    

    这是目前为止我发现的确保在解析器实际运行并执行其黑魔法之前加载每个小部件的唯一方法。当然,现在我只需要清理所有东西,并用dojo实现替换jQuerys defferred对象。