javascript - 道场 1.9 : placeAt automatically calls startup when parent widget has started up

标签 javascript html dojo

Dojo v1.9

我正在编写一些代码,以编程方式创建一个我需要放置到布局小部件中的小部件。我目前遇到的问题是 startup 被 dojo 主动调用。

如果布局小部件已经启动,则在使用placeAt(domNode) 时调用startup。这是不可取的,最好必须显式调用 startup

我这样说是因为在当前情况下,startup 被调用了两次,一次是在调用 placeAt 时,一次是在调用 startup 时之后由我手动调用。

Dojo docsrelated tutorials说当以编程方式创建小部件时,您应该始终手动调用 startup 以确保发生正确的解析。但是 startup 的自动调用导致了一些问题,启动时出现重复操作,我可以将它们移到 postCreate 中,但这只是隐藏了问题。

这是小部件创建/启动的简单示例...

var myWidget = new Widget();
myWidget.placeAt('mainContent');
myWidget.startup();

mainContent 是 ContentPane 中的一个 div,这里是布局 html...

<body class="claro">
    <div id="appLayout" data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design: 'headline'">
        <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region: 'center'">
            <div id="mainContent"></div>
        </div>
        <div class="edgePanel" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region: 'top'">Some text here</div>
        <div id="leftCol" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region: 'left'"></div>
    </div>
</body>

代码有效,这确实是我试图解决的 startup 被调用两次的问题。


更新:解决方法

建议在 startup 函数内针对小部件私有(private)变量 _started 进行检查,至少可以保护我免受重复,这是我的检查示例。

startup: function(){
    if (typeof this._started === "undefined"){
        // call inherited and pass on arguments
        this.inherited(arguments);

        // then do what ever you need here
    }
}

注意我必须使用 typeof 而不是 boolean 检查,即使在 startup 之后 _startedtrue。这是因为我发现该变量在 startup 至少运行一次之前实际上并未声明,这是需要注意的事情。

无论如何,这为我提供了一个解决方法,但没有解决 startup 被 dojo 多次调用的问题。

最佳答案

startup() 在 Dojo 中经常被自动调用。例如,每当您在容器小部件上调用 addChild() 时,都会调用子项的 startup() 方法。查看_WidgetBase 的源代码,placeAt 也是其中一个实例。

当您使用类似dom-construct 的东西将dojo 小部件直接放置在DOM 节点上时,您应该手动调用startup()

如果你想检查一个小部件是否已经启动,你可以检查小部件内的 _started 属性。这是在 startup() 方法中设置的。

关于javascript - 道场 1.9 : placeAt automatically calls startup when parent widget has started up,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19054821/

相关文章:

javascript - 函数中的 if-else 语句如何工作?

javascript - 如果不匹配用户名则禁用按钮

javascript - 菜单上下文

javascript - JQuery.append() - 如何在没有 ID 的情况下追加

button - Dijit 工具栏按钮 - 在按钮下方显示文本

javascript - 我们如何调整 dojo 网格中行的大小

javascript - 使用 d3 将按钮添加到 <g> 元素

javascript - VueJS 抛出错误,因为一些数据还没有准备好

HTML5/CSS3 如何扩展 anchor 元素以适应其父级的全尺寸

javascript - Dojo:选项[选定的 ='selected' ] 不适用于运行时更改