0

我有一个名为 的小部件ImageBox,它只是在另一个名为SlideBox.

解析后ImageBox节点结构的示例结构(我在控制台中看到的):

<div class="textwrapper">
    <div class="text">
         <h2>Title of Image</h2>
    </div>
</div>

完整 SlideBox 的示例结构:

<div data-dojo-type="dj/SlideBox" widgetid="SlideBox_1">
    <div data-dojo-type="dj/ImageBox" widgetId="ImageBox_1">
        <!-- It's here!! Right here!! -->
        <div class="textwrapper">
            <div class="text">
             <h2>Title of Image</h2>
            </div>
        </div>
    </div>
</div>

在 ImageBoxpostCreate方法中,我试图找到 textwrapper div 的高度,但是所有使用任何 dijit 注册表方法查询或查找小部件的尝试都没有返回任何内容。

请注意,textwrapper 和文本 div 是使用 dojo 创建的,而不是在原始标记中创建的。

我可以看到小部件,它就在那里,我可以看到.textwrapper我正在尝试访问的 div。似乎有一些订单内容或 Dojo 处理小部件解析的某种方式。

如何在小部件中找到小部件?

4

3 回答 3

1

您通常会使用registry.findWidgets方法来查找节点下方的小部件。如参考指南中所述,findWidgets 不会递归地在小部件中查找小部件......

但在您的情况下,将 data-dojo-attach-point 设置到小部件模板中的 textwrapper div 就足够了。像这样的东西可能在你的 ImageBox 的模板 html 文件中:

<div class="${baseClass}">
    <div class="textwrapper" data-dojo-attach-point="textwrapper"></div>
</div>

然后,您可以在 ImageBox 小部件中引用 textwrapper div:

postCreate: function() {
    // use this.textwrapper to access the textwrapper div, e.g. like:
    var contentBox = domGeom.getContentBox(this.textwrapper);
    ....
}
于 2013-02-13T08:26:13.403 回答
1

根据要求,从对 OP 答案的评论中移出:要访问子小部件,请等到 postCreate() 之后,以便可以将子小部件添加到 DOM。

然后应该可以根据小部件生命周期从容器小部件的 startup() 方法访问子小部件 - http://dojotoolkit.org/documentation/tutorials/1.8/understanding_widgetbase/

于 2013-02-19T17:03:23.267 回答
0

这似乎有点hacky,但它有效。通过在基类中添加dojo/ready调用postCreate,我可以等到一切都完成后,再进行查询。

我在每个小部件的生命周期中添加了一些 log() 调用,我发现 ImageBox 是最后触发的,因此我放入包含的任何内容postCreate都不会看到它的孩子的任何以小部件为中心的属性。将ready()调用添加到postCreate()包含小部件的调用颠倒了日志调用的顺序,从而有效地使其等待所有依赖项加载后再继续。

于 2013-02-14T08:27:02.170 回答